SVG Pattern Generator

Circle Pack

Circles dropped one at a time, each grown until it touches.

387 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 PackPHYSICS · ORGANIC
    Portrait — inset plate
  • Circle PackPHYSICS · ORGANIC
    Portrait — full bleed
  • Circle PackPHYSICS · ORGANIC
    Landscape — split
  • Circle PackPHYSICS · ORGANIC
    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

A candidate centre is thrown at the sheet, checked against every circle already placed, and if it has room it grows until it touches its nearest neighbour or hits the maximum radius. Fail the room test and the candidate is simply discarded. Nothing plans the layout and nothing moves once placed, yet the familiar structure appears anyway: big circles early while there is space, then a cascade of smaller ones filling the gaps between them, which is the same greedy process behind an Apollonian gasket.

Related patterns