Canvas Confetti

The default mode... just your regular basic average blast of confetti. But it's still a little cool, right?

Go crazy with some randomness. Shoot a random amount of confetti in random directions. (Go ahead... you know you want to click that button more than once.)

If you happened to get curious and changed the particle count to 400 or so, you saw something disappointing. An even "flattened cone" look to the confetti, making it look way too perfect and ruining the illusion. We can fix that by mixing a few effects together.


Why click a button repeatedly when you can have code do it for you? Shoot some firework of confetti from the sides of page so you can still read the content in the center.


You can combine multiple calls to confetti with any settings in order to create a more complex effect. Go ahead, combine different shapes, sizes, etc. Stagger them for an extra boost of excitement.

✨ Celebrate with a burst of stars! ✨


The effect is not limited to crazy rapid fire of confetti though. You can create a wintery mood with gently falling particles across the entire page.

But if you are into crazy rapid fire of confetti, what could be a better use than to show everyone what you are all about? Tell people where you are from with two confetti cannons from either side of the page.

🌰 Go Buckeyes! 🌰

Celebrate some holidays with holiday-appropriate shapes! You can use any SVG path to make a confetti out of it. Go wild!



Don't know any custom shapes? That's okay, just use emoji instead! That's what they are for anyway. I mean... why do they even exist if we weren't supposed to make confetti out of them? Think about it.

But if you just hate confetti all over the place, there's something here for you as well. You can limit where the confetti appear by providing your own canvas element.