Clow

Shine Button

A button with a traveling paper sheen: direction, duration, intensity and ember tint are all tunable. Forever mode loops the sweep.

Draw

draw a card
$npx shadcn@latest add @clow/shine-button
First time? Point @clow at the registry

Once per project, add the registry to your components.json. Then draw any card by name.

"registries": {
  "@clow": "https://clow.cards/r/{name}.json"
}
Full setup →

Playground

props
<ShineButton>Open the book</ShineButton>

Examples

basic

Props

proptypedefault
childrentextOpen the book
variantdefault | glow | outline | softdefault
sizesm | md | lgmd
emberbooleanfalse
directionltr | rtl | ttb | bttltr
durationnumber750
intensitynumber0.55
foreverbooleanfalse