Lab / 06 · 4 examples
Shaders
Pictures computed per pixel on the graphics card: fluid simulation, raymarching and particles written in raw WebGL2 and GLSL, each with the idea explained in plain words beside it and a poster when WebGL is not available.
Showing 4 of 4
Ink & Light
A full-screen fluid simulation written from scratch in raw WebGL2 shaders: your pointer pours luminous ink into dark water that swirls, folds and glows, with palettes, a kaleidoscope mirror and a studio of fluid settings.
WebGL2GLSLTypeScript
Event Horizon
A black hole ray-traced live in raw WebGL2: every pixel follows a bent light path through Schwarzschild geometry, so the glowing accretion disk wraps over and under the shadow with a thin photon ring, Doppler-bright on one side. Fly around it, zoom in, and switch the lensing off to see what gravity does.
WebGL2GLSLTypeScript
Particle Field
A million particles simulated on the graphics card in raw WebGL2: they drift in a curl-noise flow and spin around your pointer, and when you press and hold they gather into your initials, a sphere, a torus knot or a spiral galaxy, then scatter back into the flow when you let go. Type your own word and watch it form.
WebGL2GLSLGPGPU+1 more
Resonance
An audio visualizer in raw WebGL2: a raymarched orb whose surface is pushed out by the live spectrum, with bass punch, colour from the mids, sparkle from the highs and a beat pulse. Play a track composed in code and synthesised live, use your microphone, drop in your own audio file, or play a YouTube video.
Web AudioWebGL2GLSL+1 more