Summer pricing is live: save $50 on Starwind Pro lifetime access.

Corner Beams

Pro

A clean light-beam background that draws attention toward the center, with adjustable beam count, brightness, motion, and colors.

Upgrade to Pro
Loading code...

Starwind Dependencies

Sign in to view code and copy install commands.

Sign in

This component requires Starwind Pro.

Get lifetime access to all premium components, updates, and priority support.

Upgrade to Pro

Failed to load code. Please try again.

Code

Usage
<ShaderCornerBeams
  beamDrift={0.3}
  beamCount={7.4}
  lightStrength={0.82}
  fieldColor="#0a141c"
  beamColor="#badfff"
  coreColor="#f2c274"
/>

Props

proptypedefaultdescription
beamDrift number 0.3 Controls drift.
beamCount number 7.4 Controls beam count.
lightStrength number 0.82 Controls light strength.
opacity number 0.92 Sets the overall opacity of the shader background wrapper.
maxDpr number 1.5 Caps device pixel ratio for sharper output without runaway GPU cost.
maxFps 30 | 45 | 60 60 Caps the animation frame rate for performance-sensitive pages.
fieldColor string "#0a141c" Sets the field base color. CSS colors and normalized RGB strings are supported.
beamColor string "#badfff" Sets the beam strand color. CSS colors and normalized RGB strings are supported.
coreColor string "#f2c274" Sets the core glow color. CSS colors and normalized RGB strings are supported.