Backgrounds

Grain wash

Two colour pools bleed into each other across the frame while a slow warp keeps their border moving, all under a heavy film grain.

Live wash

Move the pointer to bend the seam

Using Grain wash

Two colour pools bleed into each other across the frame while a slow warp keeps their border moving, all under a heavy film grain.

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: colorA, colorB, speed, warp, grain, followPointer

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

1666Aurora curtainBackgroundsA soft curtain of light hanging from the top edge, its lower hem rising and falling on a slow noise wave while its color shifts across the width.

1700Gradient slat spotlightBackgroundsVertical slats hide a colour gradient until a soft spotlight tracks the pointer across them and lights each slat it touches.

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.

2110Aurora band glowBackgroundsA soft ribbon of light lying across a dark frame, its edge wandering on layered noise while the color walks along its length.

1526Aurora veilBackgroundsA full-bleed background of three drifting ribbons of light that add up where they cross, over a dark ground, with a caption layer that stays readable.

1687Drifting gradient washBackgroundsA two-tone gradient panel oversized past its frame and slowly panned back and forth, so the colour boundary drifts across the surface forever.