A card whose border lights up around the cursor, like modern SaaS cards.
npx shadcn@latest add https://hyperblur.dev/r/glow-border.jsonWorks in any React project set up with the shadcn CLI. The file lands in components/hyperblur/glow-border.tsx.
import { GlowBorder } from "@/components/hyperblur/glow-border"
<GlowBorder><div className="p-6">...</div></GlowBorder>| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | required | Card content. |
| color | string | "#2f7bff" | Color of the glow. |
| radius | number | 240 | Spread of the glow in pixels. |
| borderWidth | number | 1 | Border thickness in pixels. |
| rounded | number | 16 | Corner radius in pixels. |