Shader Tutorials
Learn GLSL from scratch — interactive lessons from your first pixel to raymarched worlds
What are shaders?
Shaders are small programs that run on your GPU, computing the color of every pixel on screen in parallel. They power the visual effects you see in games, films, and interactive art. In this course, you will start from absolute zero and work your way up through signed distance functions, noise, raymarching, and advanced techniques like fractals and volumetric effects -- all inside an interactive editor where you see results instantly.
30 tutorials across 4 sections
Foundations
Tutorials 1 - 7Hello World
Output your first color to the screen
UV Coordinates
Map pixel position to color values
Animation
Animate with the iTime uniform
Shapes: Circle
Draw circles with signed distance functions
Shapes: Rectangles
Box SDFs and combining shapes
Patterns & Tiling
Repeat patterns with fract()
Smooth Functions
Master mix, smoothstep, and clamp
Procedural Techniques
Tutorials 8 - 13Noise
Generate random values and fractal noise
2D Lighting
Point lights and glow effects
Intro to Raymarching
Render 3D scenes by ray stepping
Rotation & Transforms
Rotate shapes with matrix math
Color Spaces
HSB color model for vibrant palettes
Polar Coordinates
Radial patterns and spirals
Intermediate
Tutorials 14 - 20Domain Repetition
Infinite shapes with mod()
Smooth Blending (SDF)
Organic metaball-like blending
Voronoi Noise
Cell-based patterns and cracks
Glow & Bloom
Light emission and atmospheric glow
Morphing Shapes
Smoothly transition between shapes
Texture Sampling
Multi-pass rendering with iChannel
Post Processing
Vignette, chromatic aberration, film grain
Advanced
Tutorials 21 - 30Domain Warping
Warp space with layered noise
Reflections
Bounce rays off reflective surfaces
Soft Shadows
Raymarched shadows with soft penumbra
Fog & Atmosphere
Depth fog and atmospheric scattering
Mandelbrot Fractal
The classic fractal with infinite zoom
Julia Set
Animated fractal exploration
Water & Waves
Procedural ocean with specular highlights
Fire & Smoke
Animated fire using noise and color ramps
3D Domain Repetition
Infinite 3D object grids
FBM Terrain
Raymarched heightmap landscapes