SVG Pattern Generator

Halftone Field

Dots on a fixed grid, sized by a field that swells and thins.

893 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

  • Halftone FieldGRID · NOISE
    Portrait — your colours
  • HalftoneFieldGRID · NOISE
    Portrait — lime on forest
  • HalftoneFieldGRID · NOISE
    Landscape — ink on mint
  • Halftone FieldGRID · NOISE
    Landscape — forest on peach

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

The dots never move. Each sits at its own grid station and the only thing that varies is its radius, read from a field built by combining the distance to the centre with a band of gradient noise. That is exactly how a print halftone works, and it is why the result stays legible however hard you push it: the grid supplies the order, the field supplies the image, and the two never fight. Turn the warp down and it is a clean radial gradient; turn it up and the noise takes over the tonal range.

Related patterns