# Fluid Simulation using Shaders ( Tutorial )

**URL:** <https://discourse.threejs.org/t/fluid-simulation-using-shaders-tutorial/85109>\
**Category:** Resources\
**Tags:** shader-material, tsl, shaders\
**Created:** [July 11, 2025, 8:37pm UTC](https://discourse.threejs.org/t/fluid-simulation-using-shaders-tutorial/85109 "2025-07-11T20:37:08Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![bandinopla](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/bandinopla/32/56250_2.png) [@bandinopla](https://discourse.threejs.org/u/bandinopla)\
**Post date:** [July 11, 2025, 8:37pm UTC](https://discourse.threejs.org/t/fluid-simulation-using-shaders-tutorial/85109/1 "2025-07-11T20:37:08Z")

</div>

Tutorial on how to use and understand: [GitHub - bandinopla/threejs-fluid-simulation](https://github.com/bandinopla/threejs-fluid-simulation)  
A fluid ( or smoke / plasma / dust / … ) simulation using shaders. Versions for webGL and webGPU available (TSL)

English:

[![](https://img.youtube.com/vi/tjaH322hQdc/maxresdefault.jpg "Fluid/Smoke simulation with Shaders in ThreeJs") ](https://www.youtube.com/watch?v=tjaH322hQdc)

Spanish:

[![](https://img.youtube.com/vi/VAl09MrEPxg/maxresdefault.jpg "Simulación de fluidos con shaders en ThreeJs #javascript") ](https://www.youtube.com/watch?v=VAl09MrEPxg)

---

<div class="post-metadata">

**Author:** ![neo](https://avatars.discourse-cdn.com/v4/letter/n/9fc348/32.png) [@neo](https://discourse.threejs.org/u/neo)\
**Post date:** [July 16, 2025, 8:30pm UTC](https://discourse.threejs.org/t/fluid-simulation-using-shaders-tutorial/85109/2 "2025-07-16T20:30:06Z")

</div>

Unfortunately, your [demo](https://threejs-fluid-simulation.vercel.app/) is broken.

---

<div class="post-metadata">

**Author:** ![bandinopla](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/bandinopla/32/56250_2.png) [@bandinopla](https://discourse.threejs.org/u/bandinopla)\
**Post date:** [July 17, 2025, 10:40am UTC](https://discourse.threejs.org/t/fluid-simulation-using-shaders-tutorial/85109/3 "2025-07-17T10:40:47Z")

</div>

check again, just fixed that issue. But I have doubts since I can’t test it on a GPU because my computer sucks.

---

<div class="post-metadata">

**Author:** ![bandinopla](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/bandinopla/32/56250_2.png) [@bandinopla](https://discourse.threejs.org/u/bandinopla)\
**Post date:** [July 19, 2025, 10:29am UTC](https://discourse.threejs.org/t/fluid-simulation-using-shaders-tutorial/85109/4 "2025-07-19T10:29:40Z")

</div>

Fixed it!

> <https://github.com/bandinopla/threejs-fluid-simulation/blob/139a14c4eb491a70c5e268452b9c542c3fb33d2c/src/FluidMaterialGPU.ts>
