Sketch · 2026-06-22
Voronoi cells, three distances.
Drop a handful of seeds on a plane, then ask of every other point on the plane: which seed are you closest to? Colour the point by the answer and a tessellation falls out, one cell per seed. Change what "closest" means and the cells change shape with it.
Click empty space to add a seed. Drag a seed to move it. Right-click a seed to remove it.
What you are seeing
The field is computed pixel by pixel. For every pixel, the renderer walks the list of seeds and paints that pixel with the colour of the nearest one. No Fortune sweepline here, no half-plane intersection geometry. At this resolution, brute force updates fast enough to track a drag in real time.
Edges appear by comparison. A pixel is on a boundary if its nearest seed differs from the nearest seed of the pixel above or to its left. Marking those pixels darker draws the cell borders for free, without a second pass.
Three distances
Euclidean distance is the one you measure with a ruler:
sqrt(dx² + dy²).
Its boundaries are straight line segments, so the cells
come out as convex polygons. This is the original Voronoi
diagram from 1908.
Manhattan distance,
|dx| + |dy|, is
the number of north-south and east-west blocks you would
walk on a grid city. Its boundaries are made of segments
at 0°, 45° and 90°, so the cells become diamonds and
zig-zag polygons.
Chebyshev distance,
max(|dx|, |dy|),
is how many moves a chess king needs to reach the target
square. Its boundaries are axis-aligned, so the cells turn
into rectangular slabs that meet at sharp right angles.
Things to try
Place two seeds very close together and a third far away, then cycle through metrics. The boundary between the close pair starts as a straight Euclidean bisector. Under Manhattan it bends into a sloped Z, and under Chebyshev it collapses to one axis-aligned step. Same configuration, different geometries.
Source
Named after Georgy Voronoi, who described the construction for arbitrary point sets in 1908 in Nouvelles applications des paramètres continus à la théorie des formes quadratiques. Peter Gustav Lejeune Dirichlet had studied a related tessellation in 1850, which is why the cells are sometimes called Dirichlet domains. The brute-force ImageData approach used on this page predates both, in the sense that it is just what the definition says to do, written out as code.