Skip to content
Fieldbook
Menu
Sign in
EN

Backgrounds

Drifting Light Beams

Drifting Light Beams: Tall tilted bars of light drift upward at different speeds and blur together into a slowly shifting haze.

Using Drifting Light Beams

Drifting Light Beams uses the wide preview frame with a light/dark theme setting.

Customize the preview

These controls are passed to the demo. Defaults and limits describe the preview; consult the implementation for its full prop API.

ControlTypeDefaultPreview limits
beamCountnumber24From 6 to 48; step 2
accentcolor#38BDF8No additional limit in the metadata.
intensityselectmediumOptions: subtle, medium, strong
speednumber1From 0.2 to 3; step 0.1
blurnumber35From 5 to 80; step 1
Which frameworks are available for Drifting Light Beams?

Drifting Light Beams is available for React, Vue, Svelte, Astro, HTML. The live preview uses React; the source observations below apply to index.tsx. Check the selected port before relying on the same interactions.

What does Drifting Light Beams depend on?

The React metadata lists these npm dependencies beyond React: clsx.

What accessibility details are visible in Drifting Light Beams?

The React source for Drifting Light Beams includes: attributes and handlers (aria-hidden). These are source observations. Verify accessible names, focus order and keyboard behavior in the composed page.

How does Drifting Light Beams handle reduced motion?

Drifting Light Beams reads the motion preference in its React source through matchMedia(prefers-reduced-motion). Check the full implementation, shared styles and selected port with reduced motion enabled; these observations do not establish that every animation stops.

Connect your agent

Related open components

Still of the Light column beam component, a Fieldbook UI component in Backgrounds.
1716Light column beamBackgroundsA single column of light stands in a dark frame, breathing in width while its inner texture scrolls upward through a two colour grade.
Still of the Light cone beam component, a Fieldbook UI component in Backgrounds.
1992Light cone beamBackgroundsA grainy wedge of light flares up from a hot line at the foot of the frame, turning slowly so its edges catch different colors.
Still of the Luminous ribbon field component, a Fieldbook UI component in Backgrounds.
2187Luminous ribbon fieldBackgroundsA canvas backdrop where a few glowing ribbons weave across the frame, tapering to points at both edges and blooming toward white where they cross.
Still of the Smoke veil drift component, a Fieldbook UI component in Backgrounds.
1748Smoke veil driftBackgroundsBroad sheets of colored haze crossing a black field at an angle, thinning and thickening as they slide past each other.
Still of the Aurora veil component, a Fieldbook UI component in Backgrounds.
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.
Still of the Corner light rays component, a Fieldbook UI component in Backgrounds.
2132Corner light raysBackgroundsWide shafts of light fan in from one corner, two tinted fans crossing at slightly different angles and slowly breathing.