# Fireworks

**URL:** <https://phaser.discourse.group/t/fireworks/10579>\
**Category:** Phaser 3\
**Created:** [November 2, 2021, 4:49pm UTC](https://phaser.discourse.group/t/fireworks/10579 "2021-11-02T16:49:44Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![3b33](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/3b33/32/3334_2.png) [@3b33](https://phaser.discourse.group/u/3b33)\
**Post date:** [November 2, 2021, 4:49pm UTC](https://phaser.discourse.group/t/fireworks/10579/1 "2021-11-02T16:49:44Z")

</div>

Has anyone managed to develop fireworks? This is the closest I can get::

[https://labs.phaser.io/edit.html?src=src/game%20objects/particle%20emitter/create%20emitter%20from%20config.js&v=3.55.2](https://labs.phaser.io/edit.html?src=src/game%20objects/particle%20emitter/create%20emitter%20from%20config.js&v=3.55.2)

Wondering if there’s a better method out there.

---

<div class="post-metadata">

**Author:** ![3b33](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/3b33/32/3334_2.png) [@3b33](https://phaser.discourse.group/u/3b33)\
**Post date:** [November 2, 2021, 8:56pm UTC](https://phaser.discourse.group/t/fireworks/10579/2 "2021-11-02T20:56:43Z")

</div>

I don’t know how to share examples like others have in the past. Here is the code.

```javascript
var config = {
    type: Phaser.WEBGL,
    width: 800,
    height: 600,
    backgroundColor: '#000',
    parent: 'phaser-example',
    scene: {
        preload: preload,
        create: create
    }
};

var game = new Phaser.Game(config);

function preload ()
{
    this.load.atlas('flares', 'assets/particles/flares.png', 'assets/particles/flares.json');
}

function create ()
{
    var particles = this.add.particles('flares');

    for (let i = 0; i < 10; i++)
    {
        let x = Phaser.Math.Between(400, 300);
        let y = Phaser.Math.Between(400, 300);

        var emitter = particles.createEmitter({
            frame: ['red', 'blue', 'green', 'yellow'],
            x: x,
            y: y,
            speed: 40,
            lifespan: 1000,
            maxParticles: 40,
            scale: { min: 0, max: .07 },
            alpha: { start: 0, end: 1 },
            quantity: 3,
            blendMode: 'ADD',
            delay: Math.random() * 2000
        });

    }

}

```

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [November 3, 2021, 6:29pm UTC](https://phaser.discourse.group/t/fireworks/10579/3 "2021-11-03T18:29:55Z")

</div>

https://codepen.io/samme/embed/preview/eYEearb?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=eYEearb

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [April 6, 2022, 6:14pm UTC](https://phaser.discourse.group/t/fireworks/10579/4 "2022-04-06T18:14:10Z")

</div>

Improved I think ([full page](https://codepen.io/samme/full/mdpXqNj)):

https://codepen.io/samme/embed/preview/mdpXqNj?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=mdpXqNj

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [April 30, 2022, 4:00pm UTC](https://phaser.discourse.group/t/fireworks/10579/5 "2022-04-30T16:00:13Z")

</div>

Render texture:

https://codepen.io/samme/embed/preview/MWQgzga?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=MWQgzga

---

<div class="post-metadata">

**Author:** ![YBFJ](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/ybfj/32/7030_2.png) [@YBFJ](https://phaser.discourse.group/u/YBFJ)\
**Post date:** [October 26, 2022, 2:40pm UTC](https://phaser.discourse.group/t/fireworks/10579/6 "2022-10-26T14:40:42Z")

</div>

Thank you so much, it helps a lot

---

<div class="post-metadata">

**Author:** ![satya4satyanm](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/satya4satyanm/32/1947_2.png) [@satya4satyanm](https://phaser.discourse.group/u/satya4satyanm)\
**Post date:** [August 7, 2023, 12:07am UTC](https://phaser.discourse.group/t/fireworks/10579/7 "2023-08-07T00:07:00Z")

</div>

Actually, there should not be empty space created at the center of the particles.  
https://codepen.io/satya4satyanm/embed/preview/YzRMXGd?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=YzRMXGd

---

<div class="post-metadata">

**Author:** ![TomorrowToday](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/tomorrowtoday/32/7777_2.png) [@TomorrowToday](https://phaser.discourse.group/u/TomorrowToday)\
**Post date:** [September 27, 2023, 2:12pm UTC](https://phaser.discourse.group/t/fireworks/10579/8 "2023-09-27T14:12:31Z")

</div>

I added some particle processors that slow the flares down after the explosion. Looks a bit more like real fireworks.

https://codepen.io/TomorrowToday-the-reactor/embed/preview/rNovWYR?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=rNovWYR

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [July 27, 2024, 3:21pm UTC](https://phaser.discourse.group/t/fireworks/10579/9 "2024-07-27T15:21:21Z")

</div>

I added some drag and flicker.

https://codepen.io/samme/embed/preview/ZEdpMBv?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=ZEdpMBv

---

<div class="post-metadata">

**Author:** ![Palindrome321](https://avatars.discourse-cdn.com/v4/letter/p/9de0a6/32.png) [@Palindrome321](https://phaser.discourse.group/u/Palindrome321)\
**Post date:** [March 19, 2025, 2:45pm UTC](https://phaser.discourse.group/t/fireworks/10579/10 "2025-03-19T14:45:29Z")

</div>

Hi, can you please tell me how can I destroy particles after it’s done emitting.