Backgrounds

Warped line flow

A frame packed with diagonal hairlines is pushed by a moving warp field, so the lines bunch into bright ridges and splay into black troughs.

Using Warped line flow

A frame packed with diagonal hairlines is pushed by a moving warp field, so the lines bunch into bright ridges and splay into black troughs.

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, lineCount, speed, warp, rotation

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

1695Flowing line currentsBackgroundsDozens of long curved strokes sweep diagonally across the frame in three depth bands, braiding and bobbing like a slow current.

1739Ribbon light streamsBackgroundsBundles of hairlines sweep across the dark like ribbons of light, crossing near the middle and bending away from the pointer.

2130Contour FieldBackgroundsA full-bleed animated backdrop of nested elevation contours that swell and merge, with the pointer raising a soft bump in the terrain.

2152Fanned wave threadsBackgroundsA bundle of hairline threads pinned flat at the left edge, fanning out to the right and waving on a slow noise field.

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

1709Horizon swellBackgroundsRolling swells recede into fog toward a lit horizon, growing as they travel forward and catching a pale edge on each crest.