Usage
import { ClickSpark } from "@/registry/components/click-spark/click-spark";
<ClickSpark>Label</ClickSpark>Props
| Prop | Type | Default | Description |
|---|---|---|---|
children? | ReactNode | ||
color? | string | "currentColor" | Spark color. Defaults to the current text color. |
count? | number | 8 | Number of rays per click. |
radius? | number | 22 | How far the rays travel, px. |
size? | number | 10 | Ray length, px. |
duration? | number | 420 | Milliseconds per burst. |
className? | string |
When to use
Adding playful feedback to clicks inside a region (a hero, a game, a demo).
When not to use
Forms, dense tools or anywhere repeated clicks happen; it is decoration only.