Backgrounds

Diagonal Hatch Field

A repeating field of parallel diagonal hairlines that tiles seamlessly across a container and can slant either way.

Etch preview

Panel A, 10px pitch

A left-leaning hairline weave cut at 0.50px, sitting behind the type instead of fighting it.

10px pitch35% inkleft lean

Using Diagonal Hatch Field

A repeating field of parallel diagonal hairlines that tiles seamlessly across a container and can slant either way.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: spacing, thickness, slant, dashed, opacity, accentColor

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The preview and component description are public. Sign in with an authorized account to open the code, framework versions and installation panel.

Connect your agent

Nearby

1737Pulsing Dot FieldBackgroundsA tiled lattice of tiny dots that fills its container, each one breathing brighter and dimmer on its own independent cycle.

1668Blinking grid patternBackgroundsA hairline square grid where scattered cells fade up and back down, each hopping to a fresh cell when its blink ends.

1702Graph paper gridBackgroundsA repeating grid of hairlines that tiles across its container, fading toward the edges, with a small cluster of cells that light to an accent color and drain away again.

1708Honeycomb latticeBackgroundsA honeycomb of outlined hexagons tiling a container, with shared edges drawn only once so every seam stays a single hairline.

1690Film grain overlayBackgroundsA generated fractal grain layer that sits over any panel, tuned from fine dust to coarse tooth without loading a single image.

1972Grain FlickerBackgroundsA grain layer that redraws itself every few frames, so flat backgrounds get the restless flicker of a running projector instead of a fixed texture.