v0.0.1

Spotlight

A radial spotlight that follows the pointer inside a card, with an optional glow along the border; add the elyri-spotlight__item class to any inner element to light up its own border. Great for feature grids and pricing cards.

Elyri SpotlightMove your pointer across the card

Customize

Color
#7c8cff

Props

PropTypeDefaultDescription
childrenReactNode—Card content
colorstring'#7c8cff'Color of the spotlight and the border glow
sizenumber240Spotlight radius in pixels
glowbooleantrueWhether to show the radial glow that follows the pointer inside the card
borderGlowbooleantrueWhether to light up the border near the pointer
radiusnumber16Card corner radius in pixels
classNamestring—Extra class name

Dependencies

PointerEvent