# Motion Card Glare

Card with a glare highlight that follows the mouse.

- id: `motion-card-glare`
- Page: https://agentic-ui-kit.com/components/motion-card-glare
- Live preview: https://agentic-ui-kit.com/live/component/motion-card-glare?piece=motion-card-glare

## Install

```bash
agentic-ui add motion-card-glare
npx shadcn@4.17.0 add @agentic-ui/motion-card-glare
```

## Metadata

- **Level:** block
- **Category:** motion
- **Installable in:** Radix UI (registry variant new-york), Base UI (registry variant base-vega)
- **Capabilities:** pointer-following-glare, spot-variant, sheen-variant, intensity-and-spread, keyboard-focus-glare, no-tilt-no-transform, fine-pointer-only, token-light-in-light-and-dark, reduced-motion-fallback
- **Intents:** explore-detail, communicate
- **Suits domains:** marketing, saas, ecommerce, media, devtools, finance
- **Interaction:** hover, keyboard-navigation
- **Screen role:** overview
- **Density:** comfortable
- **Dark mode:** yes
- **Use it for:** card with a glare highlight that follows the mouse, glossy card sheen effect on hover for pricing or feature cards, light reflection that moves across a card with the cursor, holographic foil style card hover without tilting
- **Avoid when:** A 3D tilt is wanted (use motion-tilt-card, which includes its own glare), A glowing border that follows the pointer is wanted (use motion-spotlight-card), Dense lists or tables where many cards would compete, Linear and enterprise personalities, where the depth group is not allowed
- **Preserve when adapting:** glare-layer-behind-content, aria-hidden-glare, no-transform, fine-pointer-only, token-light-per-theme
- **Replace when adapting:** content, variant, intensity, spread, surface-tint, padding
- **Adaptation effort:** low
- **Coupling:** low
- **Quality breakdown:** visual 9/10, responsive 9/10, accessibility 9/10, code 9/10
- **npm dependencies:** @agentic-ui/motion, @agentic-ui/tokens, react
- **Motion:** profile subtle, library css, reduced-motion fallback yes, target 60 fps
- **Registry dependencies:** lib-motion
