# ParticleSystem and lights / fog

**URL:** <https://forum.babylonjs.com/t/particlesystem-and-lights-fog/21768>\
**Category:** Questions\
**Tags:** particles, lighting\
**Created:** [June 18, 2021, 12:53pm UTC](https://forum.babylonjs.com/t/particlesystem-and-lights-fog/21768 "2021-06-18T12:53:06Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![0L4F](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/0l4f/32/15503_2.png) [@0L4F](https://forum.babylonjs.com/u/0L4F)\
**Post date:** [June 18, 2021, 12:53pm UTC](https://forum.babylonjs.com/t/particlesystem-and-lights-fog/21768/1 "2021-06-18T12:53:06Z")

</div>

Hi there 🙂

I’m working on an animation where I’m trying to add a ParticleSystem. The particles work fine, however they seem to ignore lights and fog settings in the scene.

Is there any way to have the particles react to lights and fog?

Thanks in advance,

Olaf

---

<div class="post-metadata">

**Author:** ![syntheticmagus](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/syntheticmagus/32/395_2.png) [@syntheticmagus](https://forum.babylonjs.com/u/syntheticmagus)\
**Post date:** [June 18, 2021, 1:55pm UTC](https://forum.babylonjs.com/t/particlesystem-and-lights-fog/21768/3 "2021-06-18T13:55:59Z")

</div>

I think this might be a repro?

[Particle System Examples | Babylon.js Playground (babylonjs.com)](https://playground.babylonjs.com/#0K3AQ2#609)

I don’t know much about the particle systems, but I just changed the fog mode in one of the particle system demos from the docs, and interestingly it appears that, when I zoom out, the ground plane vanishes into the fog while the particles do not. @sebavan, is this expected? And, if so, is there a way to change the particle material to one that will be light and/or fog sensitive? I checked the [`ParticleSystem` page in the docs](https://doc.babylonjs.com/typedoc/classes/babylon.particlesystem), but the only mention I found of materials was in [`imageProcessingConfiguration`](https://doc.babylonjs.com/typedoc/classes/babylon.particlesystem#imageprocessingconfiguration), which I didn’t think was related (though I might be mistaken 🙂).

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [June 18, 2021, 2:23pm UTC](https://forum.babylonjs.com/t/particlesystem-and-lights-fog/21768/4 "2021-06-18T14:23:28Z")

</div>

Lights are not supported by design in the particles and I agree fog could be nice 🙂

If you want a normal material might be better to think about solid particle system and such has all particles are quads so the result won t be that interesting visually.

About fog you should be able to use a custom shader to add it or at least the node material editor: [Node Material and Particles | Babylon.js Documentation](https://doc.babylonjs.com/divingDeeper/materials/node_material/particles_and_nme)

I tried but am unfortunately hitting a bug with it so this is a nice catch : [https://playground.babylonjs.com/#0K3AQ2#611](https://playground.babylonjs.com/#0K3AQ2#611)

@Evgeni_Popov, could you have a look at the issue ? if not I ll have a look ASAP.

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [June 18, 2021, 4:35pm UTC](https://forum.babylonjs.com/t/particlesystem-and-lights-fog/21768/5 "2021-06-18T16:35:22Z")

</div>

In fact it is not a bug: the vertex shader is fixed for particles, you can’t modify it, what you are editing in the NME is the particle fragment shader. The `Fog` block has a vertex counter part that is missing when creating the particle shader, hence the crash.

Instead, you can implement the fog yourself in the particle shader, it’s not very complicated (I have implemented the EXP fog mode):  
[https://playground.babylonjs.com/#0K3AQ2#618](https://playground.babylonjs.com/#0K3AQ2#618)

Note that I’m using a particle texture (`cloud.png`) with an alpha channel and I set the blend mode to **STANDARD** , else you won’t get the effect you want (try changing the blend mode to something else and the texture by another one without an alpha channel like `flare.png`).

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [June 18, 2021, 4:38pm UTC](https://forum.babylonjs.com/t/particlesystem-and-lights-fog/21768/6 "2021-06-18T16:38:47Z")

</div>

In this case could we remove the fog block from the selection list in NME in particle mode @Evgeni_Popov ? (to prevent the confusion as I was so happy to see it there 🙂 )

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [June 18, 2021, 4:48pm UTC](https://forum.babylonjs.com/t/particlesystem-and-lights-fog/21768/7 "2021-06-18T16:48:49Z")

</div>

Here it is:

> <https://github.com/BabylonJS/Babylon.js/pull/10522>
