Fields and noise

Cellular noise

Distances to the nearest random points (Worley noise): bubbles, facets, crackle, grouted mosaic, pebbles, scales.

  • GPU shader
  • seamless tile
  • looping animation
Open in the editor →

Giraffe patches, the cells of a dragonfly’s wing, cracks in dried mud, foam on beer, the craquelure of old paintings: each divides the plane into cells, and every cell belongs to its own centre. Mathematicians call this a Voronoi diagram; graphics people call it cellular, or Worley, noise.

How it works

The plane is cut into a square grid (“Scale” cells across the short side) with one random point dropped into each cell. “Jitter” decides how far it may stray from the cell’s centre: at 0 the points form a regular lattice, at 1 they roam almost freely. For any pixel, checking the nine neighbouring cells finds the distances to the two nearest points, F₁ and F₂.

F₁(x) = minᵢ |x − pᵢ| F₂(x): the second nearest F₂ − F₁ = 0 on a cell border

Every mode is built from these two numbers. “F1 — bubbles”: distance grows from the centre and the cells look domed. “F2 — facets” look like cut crystal. “F2 − F1 — crackle”: the difference vanishes exactly on the borders, so the seams are thin and sharp. “Mosaic” and “pebbles” need the exact distance to the cell’s edge, found Inigo Quilez’s way through the perpendicular bisectors to neighbouring points; “Rounding” blends those bisectors to soften the corners. Mosaic tiles are flat, with a bevel and see-through grout (“Seams”); pebbles are domed. “Scales” is its own construction: discs on staggered rows, upper rows lying over lower ones and shading them, so only crescents show. “Relief” lights it all from the top left, with a highlight. The grid is periodic, so tiles are exact, and in animation the points trace small circles and come home.

A bit of history

Descartes drew regions of nearest centres in 1644, picturing vortices of matter around the stars. Dirichlet used them in 1850 and Georgy Voronoy studied them in depth in 1908, while the physician John Snow, investigating London’s 1854 cholera outbreak, outlined on a map the area whose nearest pump was the one on Broad Street, in effect a Voronoi cell. Steven Worley brought the idea to graphics with “A Cellular Texture Basis Function” at SIGGRAPH 1996, and Worley noise soon textured stone, skin and scales.

What to tweak

  • “Pebbles” with “Rounding” at 0.7–0.9 and “Relief” at 0.8 is a path of river stones.
  • “Crackle” with “Seams” at 0.05 and a muted palette looks like crazed varnish or a dry salt pan.
  • In “mosaic”, “Jitter” at 0 gives square tiles; 0.3–0.5 gives old, uneven paving.
  • “Scales” with “Jitter” near 0.2 and “Colouring” “by distance”: fish scales or a tiled roof.
  • Use it as a mask: “Domain warping” in “marble” style, masked by cellular noise, shows only where the mask is light.

Parameters

Scale
Cells across the short side
Jitter
0 is a regular grid, 1 scatters the points freely
Mode
F1 — bubbles · F2 — facets · F2 − F1 — crackle · mosaic · pebbles · scales
Seams
Width of the seams between cells
Relief
Strength of the volume and lighting
Rounding
How round the corners of the stones and tiles are
Colouring
by cell · by distance
Speed
How many circles the points trace per animation loop