Threejs Custom WebGPU Glass Material - Predator Cloak Material WebGPU for React Three Fiber
· 2:08 · Components · three.js, react-three-fiber, webgpu, tsl, shaders, tutorial, source-code, r3f
Watch on YouTube · Subscribe to the channel
Free source code:
While updating my website, I found an old project that was broken and decided to bring it back to life using WebGPU + TSL in .
I’ve always loved Predator. The first time I saw the Predator cloak effect, I knew I wanted to learn visual effects and make them part of my professional life.
Turn the sound on — it makes the experience much more fun
This is also a great exercise if you’re learning TSL and want to experiment with glass, dispersion, IOR, and custom shaders. Both the classic shader version and the new TSL version are included in the repo so you can compare the approaches side by side.
Hope it’s useful. Don’t forget to ⭐ the GitHub repo!
Links from the video
Related projects
- Advanced Glass — Coming soon for WebGPU
- Predator Material — Free Custom Material for R3F