'How can I fix the visual borders bug for Phaser 3 Particles?

I use the Particle Emitter in Phaser 3 to make shooting stars in my background. This technically works great, but there is still a problem with the particles itself. Every particle has visual borders, even though the images don't have any borders. I can't use the particles that way, it looks like someone didn't cut the right. The particles are from the phaser github page. I use the blue.png, red.png and yellow.png. I didn't edit them. My particles are in an atlas. I'm viewing it in Chrome on windows and I'm using Phaser v3.55.2 (WebGL | Web Audio).

enter image description here

You can see the borders clearly in this image.

Here's my particle emitter:

this.emitter = this.particles.createEmitter({
        frame: 'particles/' + color + '.png',
        x: { start: this.endpoint + 700, end: this.endpoint, steps: 100 },
        y: { start: yStartpoint, end: yStartpoint + 300, steps: 100 },
        lifespan: 1000,
        speed: { min: 200, max: 400 },
        angle: 330,
        gravityY: 300,
        scale: { start: 0.2, end: 0 },
        quantity: 1,
        blendMode: 'ADD'
    })

The star- and endpoint are determined elsewhere and I doubt it has to do with the bug. Can someone tell me why this happens and what I can do to fix it?

Also another question: The particle emitters move faster when I have higher quantity. Maybe I'm not understanding what quantity means here, but shouldn't quantity be the amount of the particles?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source