Shadcn.io is not affiliated with official shadcn/ui
Success Button
Button that transforms into a success checkmark when completed for React.
Success Button preview
The most satisfying button state. Click it, watch it transform into a green checkmark with a smooth animation. It tells users "done!" without needing a toast or alert. The checkmark draws itself in, then the button can reset or stay confirmed. Perfect for save buttons, add-to-cart, form submissions—anywhere success feedback matters. That little animation dopamine hit keeps users happy.
Install with AI
If you've connected the shadcn.io MCP server to Claude Code, Cursor, Windsurf, or any MCP-ready AI editor, prompt your agent to install this button for you — no copy-paste, no CLI:
use shadcnio to install the success-button button into my projectRelated Components
Loading Button
Built-in spinner
Copy Button
Clipboard with feedback
Confetti Button
Celebration particles
Bounce Button
Elastic click bounce
Shockwave Button
Impact shockwave
Ripple Button
Material Design ripple
FAQ
Was this page helpful?
Sign in to leave feedback.