Spotlight

Renders a soft radial light that follows the cursor inside the target. The element must be positioned (relative/absolute/fixed); clipping is up to you.

Move the cursor across this surface.

Usage

import { Spotlight } from '@bwo-ui/react';

<Spotlight size={320} color="rgba(255,72,31,0.18)">
  <div className="card">...</div>
</Spotlight>

Props

Prop	Type	Default	Description
`size`	`number`	`320`	Spotlight radius in px.
`color`	`string`	`'rgba(255,255,255,0.12)'`	Any CSS colour the radial-gradient accepts.
`duration`	`number`	`0.4`	Tween duration.
`ease`	`string`	`'power3.out'`	GSAP ease.
`hideOnLeave`	`boolean`	`true`	When false, the spotlight stays visible after pointerleave.