The Book of Shaders is an online introduction to fragment shaders, subtitled "a gentle step-by-step guide through the abstract and complex universe of Fragment Shaders." Its defining feature: every shader example in the book is alive — the code blocks are editable and the adjacent canvas re-renders in real time, so changing one vec3 immediately changes the color or shape you see. The authors are artist-developer Patricio Gonzalez Vivo and data scientist Jen Lowe.
At a Glance
| Item | Details (as of 2026-09-30) |
|---|---|
| URL | thebookofshaders.com |
| Type | Interactive online tutorial (GLSL fragment shaders) |
| Cost | Free |
| Account | None required |
| Languages | 14 languages including Chinese, Japanese, Korean and Spanish |
| Open development | GitHub repository (created March 2015, ~7.0k stars and still maintained as of 2026-09-30) |
Structure
The book progresses in difficulty:
- Getting started: what a shader is, "Hello world", uniforms, running shaders in different environments;
- Algorithmic drawing: shaping functions, colors, shapes, matrices, patterns;
- Generative designs: random, noise, cellular noise, fractional Brownian motion, fractals;
- Image processing: textures, image operations, kernel convolutions, filters and other effects;
- Simulation: ping-pong buffers, Conway's Game of Life, ripples, watercolor, reaction-diffusion;
- 3D graphics: lights, normal maps, bump maps, ray marching, environment maps, reflection and refraction.
The appendix covers reading offline, running examples on a Raspberry Pi and printing the book. Readers coming from JavaScript get a dedicated introduction by Nicolas Barradeau.
Background
The authors' backgrounds explain the book's temperament: Vivo is a New York-based artist and developer with an MFA from Parsons, where he has taught; Jen Lowe is an independent data scientist who cofounded the School for Poetic Computation. Translations are community-contributed — the Chinese edition is credited to Tong Li and Yi Zhang, with named contributors for Japanese, Korean, Spanish and others.
Good For
- Creative-coding and generative-art beginners learning shaders systematically;
- Front-end and graphics developers who need a quick reference for noise, fBm or ray marching;
- Teachers looking for a classroom companion (the Chinese interface helps).
Limitations
- Scoped to fragment shaders and introductory GLSL — nothing on the vertex pipeline, compute shaders or WebGPU.
- Examples use WebGL 1-era GLSL; porting to WebGL2/WGSL is up to you.
- Some chapters end with "to be continued" gaps, and translation completeness varies by language.
- The in-page editor is made for learning, with no debugging or profiling tools.
