# Shader lines animation

**URL:** <https://discourse.threejs.org/t/shader-lines-animation/84662>\
**Category:** Questions\
**Created:** [June 28, 2025, 10:30pm UTC](https://discourse.threejs.org/t/shader-lines-animation/84662 "2025-06-28T22:30:23Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Tibi](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/tibi/32/61300_2.png) [@Tibi](https://discourse.threejs.org/u/Tibi)\
**Post date:** [June 28, 2025, 10:30pm UTC](https://discourse.threejs.org/t/shader-lines-animation/84662/1 "2025-06-28T22:30:23Z")

</div>

I am just curious how this was done ?

 ![Screenshot_2025-06-09_at_16.03.21](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/0/5/05bd2153e8a24cba6efd7d6f3e9e0f7f588f1788.webp)

> **[DICH™ Fashion | A New Era of Futuristic Fashion](https://dich-fashion.webflow.io/)**
>
> Discover DICH™ Fashion's new era of futuristic fashion. Explore innovative designs that blend perfection and elegance, setting new trends in luxury apparel. Elevate your style with our cutting-edge collections.

---

<div class="post-metadata">

**Author:** ![Lukasz\_Mestales](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/lukasz_mestales/32/65638_2.png) [@Lukasz\_Mestales](https://discourse.threejs.org/u/Lukasz_Mestales)\
**Post date:** [June 28, 2025, 10:57pm UTC](https://discourse.threejs.org/t/shader-lines-animation/84662/2 "2025-06-28T22:57:29Z")

</div>

> **[Coding a 3D Lines Animation with Three.js | Codrops](https://tympanus.net/codrops/2020/12/14/coding-a-3d-lines-animation-with-three-js/)**
>
> https://youtu.be/UaAX2\_EToqk Editor's note: We want to share more of the web dev and design community directly here on C

---

<div class="post-metadata">

**Author:** ![manthrax](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/manthrax/32/2596_2.png) [@manthrax](https://discourse.threejs.org/u/manthrax)\
**Post date:** [June 30, 2025, 2:33am UTC](https://discourse.threejs.org/t/shader-lines-animation/84662/3 "2025-06-30T02:33:43Z")

</div>

> **[Glitch Code Editor ･ﾟ✧](https://glitch.com/edit/#!/seemly-thunder-swallow?path=index.html%3A120%3A30)**
>
> Simple, powerful, free tools to create and use millions of apps.

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/3/9/39864818865e81984ebb2959cdad0583a24e9546.jpeg)

---

<div class="post-metadata">

**Author:** ![Tibi](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/tibi/32/61300_2.png) [@Tibi](https://discourse.threejs.org/u/Tibi)\
**Post date:** [June 30, 2025, 6:48am UTC](https://discourse.threejs.org/t/shader-lines-animation/84662/4 "2025-06-30T06:48:02Z")

</div>

Thank you!

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [June 30, 2025, 1:00pm UTC](https://discourse.threejs.org/t/shader-lines-animation/84662/5 "2025-06-30T13:00:43Z")

</div>

Works well with `DepthTexture`

 ![изображение](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/1/f/1f98771bfa4be467f1e5ce6f2f9df76ecb11e52b.png)

Made it before noticing, that @akella did the same 😅

---

<div class="post-metadata">

**Author:** ![akella](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/akella/32/13211_2.png) [@akella](https://discourse.threejs.org/u/akella)\
**Post date:** [June 30, 2025, 1:25pm UTC](https://discourse.threejs.org/t/shader-lines-animation/84662/6 "2025-06-30T13:25:32Z")

</div>

nice job! gotta revisit this with TSL version now 🤔