Fireworks

Show Preview
Fireworks

About Fireworks

Customization Details

You can fine-tune the following parameters directly within the Framer Inspector:

🎨 Visual Styles

  • Colors: A list of colors for the exploding particles. When multiple colors are added, they are selected at random for each firework.

  • Opacity: Adjusts the overall transparency of the effect (0.0 to 1.0).

🚀 Launch (Rocket) Settings

  • Interval (ms): The delay between each launch. Lower values create a continuous, rapid-fire display.

  • Base Height: The standard peak altitude (%) for the fireworks. A ±20% random variance is automatically applied to ensure a natural look.

  • Launch Speed: The initial upward velocity of the rocket.

  • Rocket Size: Sets the thickness of the rising light trail. It includes a built-in "tapering" effect where the light thins out as it reaches its peak.

💥 Explosion (Particle) Settings

  • Base Size: The size of the individual sparks (particles) after the explosion.

  • Explosion Speed: The force at which sparks scatter upon detonation.

  • Particles: The number of sparks released per explosion. Increasing this adds luxury and density, though higher values may impact performance.

🌍 Physics & Environment

  • Gravity: The downward pull on sparks. Higher values cause particles to fall to the ground faster.

  • Drag: Air resistance that slows down the sparks. Lower values make particles lose momentum quickly, creating a "drifting" effect.

Key Design Features

  • Vertical Ascent with Flicker: While the rocket rises vertically, it features a sophisticated "flicker" effect in its light intensity, mimicking the authentic glow of a burning fuse.

  • Motion Trails: Particles leave subtle "trails" behind them, creating beautiful long-exposure-style streaks of light.

  • Clean Interface: The Inspector panel has been meticulously optimized to hide redundant buttons and input boxes, leaving a scannable, professional workspace that focuses purely on the essential settings.