Docs
Star button
Star button
The StarButton is a visually striking button that features a radial light animation with a starry background.
Installation
pnpm dlx shadcn@latest add to-setup
Usage
import { StarButton } from "@/components/ui/star-button";<StarButton className="rounded-3xl">Hover me</StarButton>Props
star-button props.
| Prop | Type | Description | Default |
|---|---|---|---|
| children | ReactNode | The content inside the button. | (required) |
| lightWidth | number | Width of the light effect in pixels. | 110 |
| duration | number | Duration of the light animation in seconds. | 3 |
| lightColor | string | Color of the light effect. | "#FAFAFA" |
| backgroundColor | string | Background color of the star effect. | "currentColor" |
| borderWidth | number | Width of the border around the button in pixels. | 2 |
| className | string | Additional custom classes for styling. | - |