rNMwbKv

index.html

<!--  RGBA.js - my own super tiny webgl/fragment shader lib for codepen works
      more examples at - https://codepen.io/collection/AWEWzK -->

<script src="https://rawcdn.githack.com/strangerintheq/rgba/0.0.5/rgba.js"></script>
<a target="_blank" href="https://github.com/strangerintheq/rgba">RGBA.js</a>

rnmwbkv.markdown

rNMwbKv

A Pen by bozzin on CodePen.

License.

script.js

RGBA(`
        vec2 mirror(vec2 uv){
             const float count = 10.;
             float a = 3.1415/count/2.;
             float cs = cos(a), sn = sin(a);
             mat2 rot = mat2(cs, -sn, sn, cs); 
             for (float i = 0.0; i<count; i++ )
                 uv = abs(uv*rot);  
             return uv;
        }

        void main() {
            vec2 uv = gl_FragCoord.xy/resolution - 0.5;
            uv.x *= resolution.x/resolution.y;
            vec2 p = uv;
            uv *= 3.4;
            
            float a = time*0.019;
            mat2 rot =mat2(cos(a),-sin(a),sin(a),cos(a));
            for(float i = 2.; i<10.; i++) {
                uv = mirror(uv);
                uv -= vec2(0.34, 0.4)+length(p)*0.1;
                
                uv *= rot;
            } 

            float d = length(uv);
            vec3 c;
            for(float i = 3.; i<9.; i++) {
                c.r += smoothstep(1.1, 0.0, abs(d-i*0.04-1.001));
                c.g += smoothstep(1.1, 0.0, abs(d-i*0.04-1.001));
                c.b += smoothstep(1.1, 0.0, abs(d-i*0.04-1.001));
            }
            
            
            gl_FragColor = vec4(vec3(c), 1.0);
        }
`)

style.css

a {
    position: fixed;
    left: calc(50% - 40px);
    font-size: 20px;
    color: white;
    mix-blend-mode: difference;
}