Confetti Falling — component for particles & physics (html)

For AI agents: find the right skill in one call — curl -s "https://skills.varg.ai/api/search?q=<what the person wants>" returns the matching use case and the best skills with install commands, as markdown (Russian works too). Full index: https://skills.varg.ai/llms.txt. Every page has a markdown twin: add .md to its path. Before generating anything, show the person the options on the use-case page.

A steady shower of confetti squares and dots tumbling down from the top with a gentle wobble

Prompt that renders it frame-exact

Use the tsParticles Confetti Falling preset (https://particles.js.org/demos/recipes/confetti-falling, MIT, options in github.com/tsparticles/presets/blob/main/presets/confettiFalling/src/options.ts) as a transparent overlay that keeps falling under an end card, a thank-you screen or a results reveal. Load @tsparticles/engine and @tsparticles/preset-confetti-falling (or its CDN bundle tsparticles.preset.confettiFalling.bundle.min.js), call loadConfettiFallingPreset(tsParticles), then tsParticles.load({ id, options: { preset: "confettiFalling", fullScreen: { enable: false } } }) into a full-frame div layered above the scene. Pre-roll a second or two of ticks before the scene starts so the frame is already full instead of filling from the top. tsParticles ticks on requestAnimationFrame and derives each step from the frame timestamp, so make it deterministic: seed Math.random before loading, swap requestAnimationFrame for a queue you flush once per video frame with the timestamp frame × 1000 / fps (keep fpsLimit at or above the video fps), and render frames in order from the moment it starts (it is a running simulation, so replay from that point after a backwards seek). Set the colors from the brand, particles.number.value for density (200, scaled by frame area unless you set number.density.enable to false, which you want for a fixed count at 1080p), and move.speed for how fast it falls.

Used in

More particles & physics