SVG Pattern Generator

Dither Threshold

A grid of dots, kept or dropped by where the noise crosses a line.

1,034 shapes · 1000 × 1000 viewBox

Colour

Leaves the backdrop unpainted so the pattern drops onto any surface. Ridgeline and Iso Cube Grid still paint the colour above, because it is what hides the shapes behind them.

Presets
Shape

See it in use

  • DitherThresholdNOISE · GRID
    Portrait — inset plate
  • DitherThresholdNOISE · GRID
    Portrait — full bleed
  • DitherThresholdNOISE · GRID
    Landscape — split
  • Dither ThresholdNOISE · GRID
    Landscape — band

As a website background

Infrastructure that gets out of the way

A worked example — your pattern, sitting behind real page furniture.

Start building

How it works

Every station on a square grid samples the noise field once. Above the threshold it keeps its dot, sized by how far above it landed; below, nothing is drawn at all. That single cut is what separates this from a halftone — there is no smooth tonal ramp, only a hard edge that the grid then renders as a ragged coastline. Sliding the threshold does not fade the sheet in and out so much as flood or drain it, and the most interesting settings sit within a few hundredths of where the field spends most of its time.