# GPU animation

Published articles for GPU animation.

This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles.

## Drawing With Light: An Exploration of Lit GPU Tubes with TSL and WebGPU

DevFeed: [Drawing With Light: An Exploration of Lit GPU Tubes with TSL and WebGPU](<https://devfeed.tech/articles/drawing-with-light-an-exploration-of-lit-gpu-tubes-with-tsl-and-webgpu-4344.md>)

Original publisher: [Read original article](<https://tympanus.net/codrops/2026/09/07/drawing-with-light-an-exploration-of-lit-gpu-tubes-with-tsl-and-webgpu/>)

Author: Mathis Biabiany

Published: 2026-09-07T14:01:56Z

Content type: tutorial

Language: en

Sources: [Codrops](<https://devfeed.tech/sources/codrops.md>)

Topics: [Three.js shaders](<https://devfeed.tech/topics/three-js-shaders.md>)

Tags: [3d](<https://devfeed.tech/tags/3d.md>), [creative-coding-webgpu](<https://devfeed.tech/tags/creative-coding-webgpu.md>), [curve-geometry](<https://devfeed.tech/tags/curve-geometry.md>), [generative-art-three-js](<https://devfeed.tech/tags/generative-art-three-js.md>), [gpu-animation](<https://devfeed.tech/tags/gpu-animation.md>), [gpu-generated-geometry](<https://devfeed.tech/tags/gpu-generated-geometry.md>), [gpu-rendering](<https://devfeed.tech/tags/gpu-rendering.md>), [gpu-tubes](<https://devfeed.tech/tags/gpu-tubes.md>), [lit-tubes-three-js](<https://devfeed.tech/tags/lit-tubes-three-js.md>), [meshline-three-js](<https://devfeed.tech/tags/meshline-three-js.md>), [meshline-webgpu](<https://devfeed.tech/tags/meshline-webgpu.md>), [meshstandardnodematerial](<https://devfeed.tech/tags/meshstandardnodematerial.md>), [nodematerial-three-js](<https://devfeed.tech/tags/nodematerial-three-js.md>), [parallel-transport-frames](<https://devfeed.tech/tags/parallel-transport-frames.md>), [pbr-materials-three-js](<https://devfeed.tech/tags/pbr-materials-three-js.md>), [playground](<https://devfeed.tech/tags/playground.md>), [procedural-curves](<https://devfeed.tech/tags/procedural-curves.md>), [procedural-geometry](<https://devfeed.tech/tags/procedural-geometry.md>), [procedural-tubes](<https://devfeed.tech/tags/procedural-tubes.md>), [three-js](<https://devfeed.tech/tags/three-js.md>), [three-js-shaders](<https://devfeed.tech/tags/three-js-shaders.md>), [three-js-tsl](<https://devfeed.tech/tags/three-js-tsl.md>), [three-js-webgpu](<https://devfeed.tech/tags/three-js-webgpu.md>), [tsl](<https://devfeed.tech/tags/tsl.md>), [tsl-shaders](<https://devfeed.tech/tags/tsl-shaders.md>), [tube-geometry](<https://devfeed.tech/tags/tube-geometry.md>), [tube-renderer](<https://devfeed.tech/tags/tube-renderer.md>), [webgpu](<https://devfeed.tech/tags/webgpu.md>), [webgpu-rendering](<https://devfeed.tech/tags/webgpu-rendering.md>), [webgpu-shaders](<https://devfeed.tech/tags/webgpu-shaders.md>)

### AI overview

A technical exploration of rendering lit GPU tubes with TSL and WebGPU. It contrasts screen-facing meshlines with tube geometry that can receive lighting, shading, and occlusion.

### Source excerpt

How a meshline habit turned into a tube renderer, and the three ways I got the maths wrong along the way.