Browse components
Glow Cursor
A soft colored glow trails the cursor inside its container and swells over interactive children.
Installation
npx shadcn@latest add @glint-ui/glow-cursorFirst time using @glint-ui? Add the registry to components.json once, or install by URL: npx shadcn@latest add https://glint-ui-seven.vercel.app/r/glow-cursor.json
Usage
import { GlowCursor } from "@/components/ui/glow-cursor";
<GlowCursor className="rounded-3xl border p-10">
<button>Hover me</button>
</GlowCursor>Props
| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | — | Content the glow sits behind. |
| color | string | "#c6ff3d" | Glow color. |
| size | number | 360 | Glow diameter in px. |
| ease | number | 0.12 | Follow easing per frame; lower trails further. |
| intensity | number | 0.35 | Resting opacity. |
| hoverScale | number | 1.5 | Scale over interactive children. |
| selector | string | "a,button,[data-glow]" | Children that make the glow brighten. |
| className | string | — | Extra classes for the root element. |