An accessible button component built on Base UI and Motion for React with shadcn/ui variants, comprehensive sizes, and physics-based hover/tap scaling.
Made by AxylDefault primary button with Motion spring scaling on hover and tap.
All visual button variants: default, secondary, destructive, outline, ghost, and link.
Button size presets from extra small (xs) to large (lg).
Button combined with leading or trailing Lucide icons.
Disabled button showing an animated spinner.
Customizable hoverScale and tapScale multipliers, with option to disable scaling.
| Prop | Type | Default |
|---|---|---|
variant? | "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | "default" |
size? | "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | "default" |
hoverScale? | number | 1.05 |
tapScale? | number | 0.95 |
disableAnimation? | boolean | false |
className? | string | - |
Built by Axyl. A motion-first component registry for React.
Last updated: 9/11/2026