Doing some GLSL, again

trying some low-level webGL "fun", after a long time

Something like 5 years ago, I dabbled a little with glsl on the gl-transitions project of @greweb. It was really fun (the “I don’t really know what I’m doing” kind of fun :-D), and I learned a lot. Since, I didn’t had the time to do some low-level webGL stuff.

This week-end, I wanted to do some low-level 2D shaders again (I’m not very good at this, but it’s fun :-D ).

It was also a pretext to:

Next things on the topic, I’ll probably try WebGL2/GLSL #version 300 es.


(please note: the examples below are in webGL/GLSL 1.0, not 2.0)

It’s always fun to poke around in shaders code, and see what happens when you change a value, a function here and there and see the result. Be sure to try editing the code !

A simple example, with a gradient, and lot of sin/cos functions:
(move your mouse over the drawing!).

GLSL code (editable)

A more complex example, with a Voronoi (from Inigo Quilez)

GLSL code (editable)