In Tutorials, by Yuki Kojima
In this tutorial, we’ll walk you through how to create bubble-like spheres using Three.js and GLSL—an effect that responds interactively to your mouse movements.
In Articles, by Niccolò Fanton
A minimal, real-time WebGL shader that applies ordered dithering and optional pixelation as a composable postprocessing effect.
In Articles, by Jean Mazouni
A closer look at the main components of the 35mm site and the core concepts and techniques behind how it was built.
In Tutorials, by Paola Demichelis
A beginner-friendly tutorial that explores how to create a dynamic text displacement effect using Three.js and custom shaders.
In Articles, by Yohei Nishitsuji
An exploration of fractals, GLSL, and simulation theory, revealing their deep connections to art, mathematics, and the nature of reality.
In Tutorials, by Jatin Chopra
Learn how to create an emissive dissolve effect, a popular technique in games for smoothly fading or transforming objects.
In Tutorials, by Oluwaseyi Oluwadare
Learn how to create a progressive image rotation effect with WebGL, using OGL and GLSL shaders.
In Tutorials, by Colin Demouge
A simple yet cool image reveal effect created with React-Three-Fiber/Drei and animated using Framer Motion.
In Tutorials, by Andrico Karoulla
Explore the world of shaders with this easy-to-follow guide to creating a custom ASCII art animation using WebGL, Perlin noise, and GLSL.
In Tutorials, by Matias Perez
Learn how to create an interactive shader background effect using React Three Fiber and Drei in four simple steps.
In Tutorials, by Oguzhan Tufenk
Learn how to create a custom jitter shader in React-Three-Fiber, inspired by the visual style of PS1-era games, to add a retro aesthetic to 3D models.
In Tutorials, by Jean Mazouni
Learn how to apply a pixel/grid displacement to a texture in Three.js using shaders and GPGPU with a subtle RGB shift effect on cursor move.
In Tutorials, by Jan Kohlbach
Learn how to create distortion and grain effects on scroll using Three.js shaders, syncing HTML images with WebGL.
In Tutorials, by Jorge Toloza
Learn how to create an interesting progressive blur effect using WebGL, OGL, and GLSL shaders.
In Tutorials, by Robert Leitl
Learn how to use WebGPU compute shaders to create reaction-diffusion patterns.
In Tutorials, by Torin Blankensmith
Learn how to craft audio reactive shaders with Three.js and Shaderpark.
In Playground, by Yuri Artiukh
A brief exploration into how to twist and rotate text in 3D using Three.js and Shader magic.
In Tutorials, by Francesco Michelini
Learn how to create a WebGL-powered image slideshow animated using a single value.
