Realistic Fireworks Animations Using Canvas - fireworks.js

"fireworks.js is a simple-to-use and fully configurable JavaScript library that creates realistic fireworks animations using HTML5 canvas elements. It automatically handles particle physics and explosion mechanics to create an immersive celebration atmosphere. Features: HTML5 Canvas Rendering: It draws particles on a canvas element. Multi-Framework Support: It runs natively in Vanilla JS, jQuery, React, and Angular environments. Responsive Design: It automatically detects the container's dimensions."

"Configurable Visuals: It allows adjustments to canvas opacity and explicit dimensions. Z-Index Management: It places the canvas in the background (z-index 0) to avoid blocking content interaction. Use Cases: New Year's Eve Landing Pages: Set the background of a hero section to display continuous fireworks. Gamification Success States: Adds visual flair when a user completes a level or unlocks an achievement. E-Commerce Order Confirmation: Creates a moment of delight immediately after a customer completes a purchase."

fireworks.js is a configurable JavaScript library that renders realistic fireworks using HTML5 canvas and handles particle physics and explosion mechanics automatically. The library supports Vanilla JS, jQuery, React, and Angular and adapts to container dimensions for responsive layouts. Visual parameters such as canvas opacity and explicit sizing are adjustable, and the canvas is placed at z-index 0 to avoid blocking interactions. Typical use cases include celebratory backgrounds for landing pages, gamification success states, order confirmations, and anniversary announcements. Initialization requires including the core script, optional jQuery wrapper, creating a container element, and invoking the fireworks function.

Read at jQuery Script