Effects

canvas-confetti

The celebrate-anything library. Fireworks, snow, school pride.

Live democonfetti

Pick a preset:

canvas-confetti is a tiny, dependency-free way to celebrate any action — sign-ups, purchases, achievements. Works from any event, fully customizable.

Install

npm i canvas-confetti

Snippet

import confetti from "canvas-confetti";

// Basic burst
confetti({ particleCount: 120, spread: 70, origin: { y: 0.6 } });

// Fireworks
const end = Date.now() + 2000;
(function frame() {
  confetti({ particleCount: 5, angle: 60, spread: 55, origin: { x: 0 } });
  confetti({ particleCount: 5, angle: 120, spread: 55, origin: { x: 1 } });
  if (Date.now() < end) requestAnimationFrame(frame);
})();