KQ-208 · GRADIENT/DRIFT
Gradient Drift
An ambient backdrop of soft gradient blobs that drift and breathe past each other — pure CSS and transforms, no canvas or WebGL. Each blob follows its own slow mirrored loop at a different tempo, so the field never visibly repeats, and heavy blur melts them into a single wash behind your content.
KQ-208 · GRADIENT/DRIFT
AMBIENT
A quiet, drifting wash
Backdrop CSS-only, no canvas
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/gradient-drift
Props
- height
- number
- default —
- Stage height in px when standalone.
- children
- ReactNode
- default —
- Content rendered above the wash.
| Prop | Type | Default | Description |
|---|---|---|---|
| height | number | — | Stage height in px when standalone. |
| children | ReactNode | — | Content rendered above the wash. |