# Use fog at certain part of the world?

**URL:** <https://forum.babylonjs.com/t/use-fog-at-certain-part-of-the-world/7420>\
**Category:** Questions\
**Created:** [December 6, 2019, 5:23pm UTC](https://forum.babylonjs.com/t/use-fog-at-certain-part-of-the-world/7420 "2019-12-06T17:23:14Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![HappyDev](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/happydev/32/2236_2.png) [@HappyDev](https://forum.babylonjs.com/u/HappyDev)\
**Post date:** [December 6, 2019, 5:23pm UTC](https://forum.babylonjs.com/t/use-fog-at-certain-part-of-the-world/7420/1 "2019-12-06T17:23:14Z")

</div>

Using [Environment - Babylon.js Documentation](https://doc.babylonjs.com/babylon101/environment#fog) produces the fog effect on the whole world.

Is there any way to apply the fog effect only at certain positions/areas ?

---

<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:** [December 6, 2019, 5:37pm UTC](https://forum.babylonjs.com/t/use-fog-at-certain-part-of-the-world/7420/2 "2019-12-06T17:37:10Z")

</div>

That would be volumetric fog and would need a custom shader.

You can have a look here: [Tomb Raider Nostalgia - Babylonjs](https://popov72.github.io/TRN2/babylonJS/public/TRN.html?relpath=../../&engine=babylonJS&trgame=TR4Cut&level=tr4/ang_race.tr4&autostart=0&cutscene=8)

It’s a simple volumetric-like fog effect that can serve as a basis for yours.

Source code is:

> <https://github.com/Popov72/TRN2/blob/master/resources/shader/TR_volumetric_fog.fs>

---

<div class="post-metadata">

**Author:** ![HappyDev](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/happydev/32/2236_2.png) [@HappyDev](https://forum.babylonjs.com/u/HappyDev)\
**Post date:** [December 6, 2019, 8:50pm UTC](https://forum.babylonjs.com/t/use-fog-at-certain-part-of-the-world/7420/3 "2019-12-06T20:50:26Z")

</div>

I see. I pretty much know nothing about shaders except their names ☹

So forgive my ignorance but don’t I need a vertex shader to accompany the fragment one you linked ?

For example , would it be difficult to test it using [https://cyos.babylonjs.com/](https://cyos.babylonjs.com/) ?

And if not, could you point me to the right direction please ?

---

<div class="post-metadata">

**Author:** ![PirateJC](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/piratejc/32/1003_2.png) [@PirateJC](https://forum.babylonjs.com/u/PirateJC)\
**Post date:** [December 6, 2019, 10:14pm UTC](https://forum.babylonjs.com/t/use-fog-at-certain-part-of-the-world/7420/4 "2019-12-06T22:14:01Z")

</div>

Hey @HappyDev

You might want to check out the brand new Node Material Editor! It’s a fantastic new tool that we’ve just added to Babylon that allows you to create shaders without writing code! It’s entirely node based and super fun and easy to use.

Here’s the tool:  
[https://nme.babylonjs.com/](https://nme.babylonjs.com/)

And be sure to check out our [YouTube channel](https://www.youtube.com/channel/UCyOemMa5EJkIgVavJjSCLKQ) for lots of videos on how to use it!

Here are a few videos you may want to check out as you learn about it!

---

<div class="post-metadata">

**Author:** ![aFalcon](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/afalcon/32/7015_2.png) [@aFalcon](https://forum.babylonjs.com/u/aFalcon)\
**Post date:** [December 6, 2019, 10:27pm UTC](https://forum.babylonjs.com/t/use-fog-at-certain-part-of-the-world/7420/5 "2019-12-06T22:27:57Z")

</div>

Those vids are very good. And the design style, of the title page, makes them look great.

Also @Pryme8 was working with volumetric fog not long ago. I bet he has updates.

[https://playground.babylonjs.com/#1UWAVK#32](https://playground.babylonjs.com/#1UWAVK#32)

🦅 : )

---

<div class="post-metadata">

**Author:** ![withADoveInOneHand](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/withadoveinonehand/32/1243_2.png) [@withADoveInOneHand](https://forum.babylonjs.com/u/withADoveInOneHand)\
**Post date:** [December 7, 2019, 5:55am UTC](https://forum.babylonjs.com/t/use-fog-at-certain-part-of-the-world/7420/6 "2019-12-07T05:55:40Z")

</div>

Can you change scene.fogStart etal. in realitime?  
It’s not quite the same effect but you could maybe grade scene.fog in/out in different areas. Might work best with an isometric camera

---

<div class="post-metadata">

**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\
**Post date:** [December 7, 2019, 4:19pm UTC](https://forum.babylonjs.com/t/use-fog-at-certain-part-of-the-world/7420/7 "2019-12-07T16:19:14Z")

</div>

That I do, I made it way way way better and more performant. But the sad news is you are gonna hafta wait for when Im done with it to get another look at it.

---

<div class="post-metadata">

**Author:** ![samevision](https://avatars.discourse-cdn.com/v4/letter/s/73ab20/32.png) [@samevision](https://forum.babylonjs.com/u/samevision)\
**Post date:** [May 11, 2021, 9:48pm UTC](https://forum.babylonjs.com/t/use-fog-at-certain-part-of-the-world/7420/8 "2021-05-11T21:48:26Z")

</div>

I just found this „old“ thread. Would you like to share the fog shader? It would be very helpful. 🙂
