Creating 3D smoke particles in Three JS

[manthrax]

Try setting:

depthWrite: false on your smoke material? That may remove the clipping around the particle edges.

There’s a bunch of approaches for rendering smoke but the one you’re using can be pretty effective with lots of particles and/or different particle sprite textures and parameter animation.

Here’s a few resources on other particle systems:

Sometimes folks start with the stemkoski one and optionally modify it: Particle Engine (Three.js)

Another more complex/slicker library:
Nebula particle engine: GitHub - creativelifeform/three-nebula: WebGL based particle system engine for three.js

A thread on smoke:

How to make 3D smoke

If something like this is what you want, then it’s achievable with sprites like @Chaser_Code has suggested. In the gif I move sprites up and enlarge them slightly as they move. At some point their transparency starts to fade until they are no longer visible. Add some randomization into the process and a bit of coloring - and you get something looks quite believable. [smoke_particles_2022_02_06] here are the color and scale(controls size) curves I use for the particles: [image]

And some particle textures for experimentation:

Particle Pack · Kenney