Shadcn.io is not affiliated with official shadcn/ui
Confetti Button
Button that bursts confetti particles on click for celebratory moments in React, Next.js, shadcn/ui, Tailwind CSS, TypeScript. Built on the base-ui shadcn Button.
Confetti Button preview
Click and celebrate. This button explodes with colorful confetti particles that burst outward and fade away. Perfect for those "hell yeah" moments—completing a purchase, unlocking an achievement, submitting a form successfully. The particles shoot out with realistic physics, arc naturally, and disappear gracefully. It's instant dopamine for your users. Built on top of the shadcn Button so every variant and size you already use just works.
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 confetti-button button into my projectRelated Components
Success Button
Success checkmark state
Icon Button
Icon with active state
Ripple Button
Material click ripple
Pulse Button
Pulsing attention rings
Shake Button
Triggered error shake
Counter Button
Animated increment
FAQ
Was this page helpful?
Sign in to leave feedback.
Border Trace Button
Button with an animated border that traces around the perimeter on hover for React, Next.js, shadcn/ui, Tailwind CSS, TypeScript. Built on the base-ui shadcn Button.
Copy Button
Copy-to-clipboard button with animated icon swap and success feedback for React, Next.js, shadcn/ui, Tailwind CSS, TypeScript. Built on the base-ui shadcn Button.