SVG Pattern Generator

Circle Lattice

Circles sized past the point where they meet.

9 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

  • Circle LatticeSEAMLESS · RADIAL
    Portrait — inset plate
  • CircleLatticeSEAMLESS · RADIAL
    Portrait — full bleed
  • CircleLatticeSEAMLESS · RADIAL
    Landscape — split
  • Circle LatticeSEAMLESS · RADIAL
    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

Circles on a square lattice, with the radius free to exceed half the spacing. Below an overlap of one they sit apart as a plain dot grid; at exactly one they kiss; above it their intersections begin drawing the lens shapes that make the field read as interlocking rings rather than as separate circles. Everything worth looking at is above one.

Related patterns