How to render geometry edges?

I want to render the outline of a cube, which includes the ‘front-facing’ edges. I don’t want to be able to see through the mesh, so a wireframe or edgesGeometry wouldn’t fit in this scenario (see demo codepen -

I don’t want to duplicate the cube (as per this demo -

If a cube is touching another, I don’t want to render it’s touching edges but still want to be able to control the cube individually so I don’t want to merge the geometry. Two screenshots attached show the two scene states that I want to be able to replicate.

Is this possible and could anyone give me some resources/techniques/advice on achieving this?

Thanks in advance!

Together Apart

Straight from the twilight zone of my mind:

I’m not sure that the approach is efficient enough. The other users can comment on it :slight_smile:


Have you tried to use THREE.OutlinePass (a post-processing approach)?

Set the hiddenEdgeColor parameter to 0x000000 so hidden edges are not visible in the demo.


Thank you @prisoner849 and @Mugen87 for your ideas.

I’ll investigate both of these options and see what I come up with :slight_smile:

Amazing. How can I use it for any meshes?

This is a very specific solution, intended excelusively for boxes.

I think there’s a better solution, using this shader:



Oh, awesome. I’ll take a look and think about implementing! Thanks for the info :slight_smile:

Hey there! im a newbie in this field and i was wondering if there is a way to render only the borders. in other words i want the pure black to be fully transparent and only the borders to be visible. Thanks in advance :smiley:

Maybe this helps?

From the Collection of examples from

In addition to @hofk 's links: LDraw-like edges

@prisoner849 is there a way to use your shader with triangles? (all polygons of a BufferGeometry with edges, like there were a WireframeGeometry, but only with a custom shader)