Shader editor | ShaderToy

Tweaking icon
Tweaking icon
Tweaking icon
Settings icon
Examples icon
Question icon
Errors icon
Saves icon

Canvas settings

Shader settings

Shader examples in glsl


Pause icon Continue icon Start icon Start icon Start icon

About editor

The key feature of this editor is that together with the fragment shader you can also edit the vertex shader. Provided that you understand linear algebra, matrices, and vectors.
This tool was created to solve two main tasks:
  • Creating glsl shaders for further use
  • Sharpening your math skills and knowledge
It is actively developing. I plan to add:
  • Choosing between webgl and webgl2
  • Improved UX/UI for save button and error output
  • Ability to name saves
  • Add texture support
  • Add keybingins
It is important to consider the following 'features' when working with tool.
  • Texture not implemented yet
  • There are 3 build-in uniforms
    • vec2 u_time is the time since the page started loading.
    • vec2 u_resolution is the width and height of the canvas
    • vec2 u_mouse it is a x and y mouse coordinates, relative to canvas
  • If you made changes to the shader and updated it, but nothing happened,Check if it's paused
  • Text input fields require numbers separated by commas
  • Not all shaders in the shader library are mine.