SVG Pattern Generator

Herringbone

Planks meeting end to side, stepping on the diagonal.

36 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

  • HerringboneSEAMLESS · GRID
    Portrait — inset plate
  • HerringboneSEAMLESS · GRID
    Portrait — full bleed
  • HerringboneSEAMLESS · GRID
    Landscape — split
  • HerringboneSEAMLESS · 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

Two-by-one planks, each abutting the end of the last at a right angle. The arrangement is easy to draw once and surprisingly awkward to repeat: the unit is one horizontal plank and one vertical, and it translates along the chain and across it by two vectors that happen to span exactly the area of those two planks — which is the condition for covering the plane with no gap and no overlap. Get it slightly wrong and the field tiles with a fault line running through it, which is the usual fate of this pattern. The rectangle a repeating tile needs is then four units square, holding eight planks.

Related patterns