Selected ComponentSpotlight Card
Showcase Mode
Spotlight Cards · @componentry

Five interactive variants.

Hover any card to see its cursor-driven lighting effect. Each card uses a different technique — gradient borders, multi-spotlight blends, cross beams, radial gradients, or 3D tilt with glare.

Spotlight Card

Conic gradient border meets a soft cursor-following spotlight wash.

<SpotlightCard />

Multi Spotlight

Three offset radial gradients in violet, rose, and mint blend like RGB beams.

<MultiSpotlightCard />

Beam Spotlight

A vertical and horizontal beam intersect at the cursor with a glow burst.

<BeamSpotlightCard />

Gradient Follow

A three-color radial gradient backdrop tracks the cursor position smoothly.

<GradientFollowCard />

Tilt Spotlight

3D perspective tilt + glare highlight + spotlight for a tactile, premium feel.

<TiltSpotlightCard />