Glare Card
Sheet of light tracking the cursor, like a foil trading card.
- 0.8 KB gzipped
- Zero dependencies
- Reduced-motion safe
- Base UI & Radix compatible
Preview
Velora Pass
•••• •••• 4821
Member
Priya Raman
Valid thru
09/28
Installation
pnpm dlx shadcn@latest add https://velora.colorlib.com/r/glare-card.jsonAdds components/velora/glare-card.tsx and merges the keyframes and tokens into your CSS.
Props
| Prop | Type | Default |
|---|---|---|
children* | React.ReactNode | — |
className | string | — |
Accessibility
- Reduced motion
- The glare still follows the cursor, since it is pointer-driven, but it appears and disappears without the fade.
- Keyboard
- Decorative — nothing to operate.
- Screen readers
- The glare layer is aria-hidden and the children are read normally.