# Light tunnel background animation

**URL:** <https://discourse.threejs.org/t/light-tunnel-background-animation/63364>\
**Category:** Questions\
**Tags:** animation\
**Created:** [March 28, 2024, 12:43pm UTC](https://discourse.threejs.org/t/light-tunnel-background-animation/63364 "2024-03-28T12:43:01Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![brown\_sheep](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/brown_sheep/32/46226_2.png) [@brown\_sheep](https://discourse.threejs.org/u/brown_sheep)\
**Post date:** [March 28, 2024, 12:43pm UTC](https://discourse.threejs.org/t/light-tunnel-background-animation/63364/1 "2024-03-28T12:43:01Z")

</div>

Hey Guys, I need help with understanding how to achieve background animation similar to this website

[https://titancapital.au](https://titancapital.au)

It has cool background animation which plays on scroll. I am new to threejs and animations, wanted to know if there is some tutorial which can help me learn this animation or some resources I can explore.

---

<div class="post-metadata">

**Author:** ![Arthur](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/arthur/32/22954_2.png) [@Arthur](https://discourse.threejs.org/u/Arthur)\
**Post date:** [March 28, 2024, 3:17pm UTC](https://discourse.threejs.org/t/light-tunnel-background-animation/63364/2 "2024-03-28T15:17:38Z")

</div>

These two tutorials should help with the visuals:  
[https://tympanus.net/codrops/2023/03/22/cyberpunk-inspired-three-js-scene-with-javascript-and-blender/](https://tympanus.net/codrops/2023/03/22/cyberpunk-inspired-three-js-scene-with-javascript-and-blender/)  
[https://tympanus.net/codrops/2019/11/13/high-speed-light-trails-in-three-js/](https://tympanus.net/codrops/2019/11/13/high-speed-light-trails-in-three-js/)

When you have something that looks like what you want to do, you can then look into animating it on scroll.

---

<div class="post-metadata">

**Author:** ![brown\_sheep](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/brown_sheep/32/46226_2.png) [@brown\_sheep](https://discourse.threejs.org/u/brown_sheep)\
**Post date:** [March 28, 2024, 10:18pm UTC](https://discourse.threejs.org/t/light-tunnel-background-animation/63364/3 "2024-03-28T22:18:02Z")

</div>

Thanks a lot Arthur,

These tutorials you shared should help. Do you know any tutorial for Text reveals as well?

Does that need threejs as well, I feel i might be able to do it using gsap animations.
