Shader track

Pixels on the GPU

Six modules — learn the fragment shader mindset with tiny WebGL fullscreen demos (no Three.js required). You’ll read GLSL ES, play with v_uv, time uniforms, and procedural patterns. Serve over HTTP for consistent WebGL; file:// may still work in modern browsers.

1

Pipeline & UV space

Vertex quad · varying v_uv

2

Functions of UV

sin bands · aspect ratio fix

3

Time uniform

u_time · motion in the fragment shader

4

Distance fields

length · smooth circles · glow

5

Layered patterns

Stacked sines · faux plasma

6

Compose & kaleidoscope

atan folding · ripples + ring accent