Low Poly & Stained Glass
Turn a photo into flat triangles, or into a stained glass window.
Loading…
About the Low Poly & Stained Glass converter
Scatter points across a picture, join them into triangles, and fill each one with the average colour underneath. The result is the faceted, geometric look — and with a dark line drawn along every edge, the same triangles become a stained glass window.
Everything happens on your own device, and the vector export is genuine: the facets are already polygons, so the SVG is exact rather than a trace of a bitmap.
Why most low poly generators look like melted plastic
The triangles are the easy part. What decides whether the result is any good is where the corner points go, and a plain random scatter is what ruins it: points land evenly, so half of them are wasted on empty sky while the outline of the subject gets almost none. Edges end up wobbling across shapes that should be sharp.
Here the scatter is weighted by the picture's own brightness gradient — a Sobel edge detection — so corners gather where the detail actually is. A slider controls how strongly, from an even decorative mesh to nearly every point sitting on an edge.
The triangles themselves are a Delaunay triangulation, the arrangement in which no triangle's circumcircle contains another point. That is the property that avoids long thin slivers, which read as glitches rather than facets.
Stained glass
The stained glass look is the same triangulation with a dark line along every edge, standing in for the lead came that holds real panes together. Both the thickness and the colour of the lead can be set.
The board is painted first and the panes laid over it, rather than each pane drawing its own outline. Otherwise every triangle covers half of its neighbour's line and the joins come out uneven, which is the detail that stops it reading as glass.
Pushing the colour past its original saturation suits this mode: real glass is far more intense than a photograph, so a picture left at its natural colours looks washed out once the leading goes in.
Vector output that is actually vector
Most image effects can only ever give you pixels back. This one is different, because the facets are polygons before they are ever drawn: the SVG contains one polygon per triangle with its exact corners, so it prints at any size without going soft.
That makes it usable for things a bitmap could not do — a wall print, a vinyl cut, a laser or plotter file, a backdrop that has to scale. The PNG is there for everything else.
Choosing the detail
A few hundred points gives an abstract arrangement of colour planes, closer to a mosaic than a photograph: handsome as a pattern, but the subject dissolves. Around fifteen hundred is the point where a picture stays clearly recognisable while the faceting still reads as a deliberate style.
Faces need more than landscapes, because an eye or a mouth carries the likeness in a small area. If a portrait softens, raise the detail and the edge weighting together.
Nothing is random between renders. The same picture and the same settings always give the same result, and the rearrange button steps to a different scatter at the same density.
Frequently asked questions
Is my photo uploaded?
No. It is read into a canvas in your own browser, all the work happens on your device, and the PNG or SVG you download is produced there too. Nothing is sent anywhere at any point.
What is a Delaunay triangulation?
It is the way of joining a set of points into triangles such that no point falls inside any triangle's circumcircle. In practice it means the triangles are as close to equilateral as the points allow, which avoids the long thin slivers that would otherwise look like rendering errors.
How many points should I use?
Around 1,500 keeps a photograph recognisable while still looking clearly faceted. A few hundred gives an abstract, decorative result. Portraits generally need more than landscapes, since the likeness lives in small areas.
Is the SVG a real vector file?
Yes, and not a trace. The triangles exist as polygons before anything is drawn, so the SVG holds the actual geometry with exact corner coordinates. It scales to any size cleanly and can be used for cutting, plotting or large-format printing.
Why does my portrait lose the face?
The point scatter follows brightness gradients, and a face carries its likeness in small, low-contrast areas like the eyes and mouth. Raise both the detail and the edge weighting; the extra points will go where the contrast is.
Can I get the same result again later?
Yes. Nothing is random between renders — the same image with the same settings always produces exactly the same triangles. The rearrange button moves to a different arrangement at the same density.
What size images can it handle?
Any size. Large pictures are scaled down to work at a sensible resolution so the sliders stay responsive, and because the output is vector geometry, that ceiling does not limit how large the SVG can be printed.