Neo-Brutal Backdrop
The kit's signature background: the twelve column guides of the page grid, drawn as faint 2 px rules that draw down once, 60 ms apart, when they first come into view (with a dot field at high).
Swiss Tech MonoMotion
Backdrop
The Mono grid: the page's column guides (4 on phones, 12 from md) on the Container's columns, drawing down 45 ms apart when the band comes into view.
Live, interactive React component · light themeResponsive
About the Swiss Tech Mono Backdrop
The Mono grid: the page's column guides (4 on phones, 12 from md) on the Container's columns, drawing down 45 ms apart when the band comes into view. Put it first inside a relative isolate parent (the ink band, the acid band, a CTA panel): it sits behind the content, clipped to the parent, and never takes pointer events. It has no ambient loop. On paper, GridGuides already prints the guides; use Backdrop on toned bands only.
It is part of Swiss Tech Mono. The style’s 92 pieces share one set of tokens, type and motion, in a light and a dark theme, so whatever you take from it fits together.
To put it in your project, copy the prompt into Claude Code, OpenAI Codex or Cursor, or add the file and its styles by hand. The documentation walks through both.
See it on a full page
Noir Aurora Backdrop
Noir's signature: the northern-lights curtain (a sky glow, three curtains of noise-masked rays with a violet fringe, and a bright hem) that lowers into place on load, then sways and breathes slowly.
Soft Bento Backdrop
Soft Bento's background: soft candy blobs (peach behind the copy, butter low in the middle, lilac top right) drifting slowly; on the blue block they turn into warm white glows and wind grooves drift across.