Click the preview button
Watch confetti particles burst outward and fade from the click point.
CSS Confetti Button Generator
Build a button that bursts colorful confetti on click. Tune the count and colors, then copy the ready-to-use snippet.
Ready-to-use HTML + CSS + JS
How it works
Tune count and color
Adjust particle count and the button's base color to match your design.
Copy the snippet
Get self-contained HTML, CSS and JavaScript ready to paste into your project.
FAQ
How does the confetti burst work?
On click, a small script creates several colored particle elements at the click point and animates each one to a random offset and rotation with CSS, then removes them once the animation ends.
Will too many particles slow down my page?
A moderate particle count (20-40) animates smoothly on most devices. Very high counts on many buttons at once can affect performance, so test on the devices you care about.
Can I trigger the confetti from any element, not just a button?
Yes. The JavaScript snippet listens for a click event and can be attached to any element, not only a button.