Shimmer Button

A button with an animated shimmering border light effect.

Installation

pnpm dlx shadcn@latest add "https://godui.design/r/shimmer-button.json"

tsx

import { ShimmerButton } from "@/components/godui/shimmer-button";

tsx

<ShimmerButton variant="primary">Click me</ShimmerButton>

Set shimmer={false} to keep the button styling without the animated border light.

Prop	Type	Default	Description
`variant`	`"primary" \| "secondary" \| "outline"`	`"primary"`	Visual style of the button
`size`	`"sm" \| "default" \| "lg"`	`"default"`	Button padding and text size
`shimmer`	`boolean`	`true`	Animate the button with a shimmering border light effect
`shimmerColor`	`string`	variant default	Color of the shimmering light
`shimmerDuration`	`string`	`"3s"`	Duration of the shimmer animation
`background`	`string`	variant default	Background color override

Progress Fold Button

A 3D button whose front face folds back to reveal a controlled progress bar while loading.

Slide Confirm Button

A drag-to-confirm thumb for high-stakes actions — slide past the threshold to commit, release early to spring back.