Shaders (GLSL)

Basic shapes examples

• circle.glsl
• square.glsl

WebGL1 examples

For older computers that don't support WebGL2.

• circle_webgl1.glsl

Basic animated examples

• rotating_square.glsl
• animated_sine.glsl

Advanced examples

• bridge.glsl
• jellyfish.glsl
• rio.glsl
• shadertoy_compatible.glsl
• multipass.glsl
• draw_fire.glsl
• raymarching.glsl
• raymarching_basic_shading.glsl

Found a shader compilation problem in an example? Report the problem on github: ShaderGif Issues on github

Please include the fix if you know it!

The vast amount of different devices, graphics chips and operating systems using webgl makes it possible to find a vast array of shader problems.

Javascript

Basic shapes examples

• circle.js
• square.js

Using loops

Be aware of the dangers of infinite loops! But you can always reboot if you are in trouble...

• forloop.js

p5js

• circle.p5js