WebGL Shader Playground

Writing shaders should be a sub-second feedback loop.

What it is

Open the page, write GLSL on the left, see the output on the right in real time. No submit button—every keystroke re-renders.

Why we built this

The worst part of writing shaders is the feedback loop: write → save → run → look → repeat. We compressed that loop down to “updates the moment you finish typing a character”.

How to use

Edit the fragment shader in the left pane, the canvas is on the right. Supported uniforms:

• uniform float uTime — current time, injected automatically
• uniform vec2 uResolution — canvas size
• uniform vec2 uMouse — mouse position

Preset buttons: noise / plasma / voronoi / tunnel—click to switch.

Stack

• ogl (≈ 20KB WebGL lib)
• textarea + custom syntax highlight (using prismjs)
• Compile errors surface below the shader

Known issues

• Some older GPUs choke on fbm
• No vertex-shader support (fragment-only for now)