WebGL Shader Lab
Edit GLSL fragment shaders in the browser with a live WebGL preview and built-in animation presets.
Edit the GLSL fragment shader on the left, preview renders in real-time on the right. Available uniforms: u_time (seconds), u_resolution (pixels), u_mouse (mouse position). Move your mouse over the preview to interact.
Use Cases
- Learn GLSL shaders
- Debug fragment shaders
- Create real-time animations
How to Use
Use the workspace above to type, paste, choose, or drop content and get the result immediately. Files and text stay local in your browser by default.
FAQ
Do I need to install anything?
No. Shader Lab runs WebGL2 directly in your browser, no installation required.
Which uniforms are available?
Built-in uniforms: u_time (seconds), u_resolution (canvas pixels), u_mouse (mouse position), compatible with Shadertoy.
Why does compilation fail?
Ensure you use GLSL 300 es syntax (#version 300 es) and output via out vec4 fragColor instead of gl_FragColor.
Related Tools
JSON Formatter
Format, minify, and validate JSON locally in your browser.
UUID Generator
Generate UUID v4 values locally in your browser.
JWT Decoder
Decode JWT Header and Payload locally. Signature verification is not performed.
Regex Tester
Test a JavaScript regular expression against text and inspect matches.