← NEON SILK v1

index.html

<canvas id=c style=position:fixed;top:0;left:0;width:100%;height:100%><script>g=c.getContext`webgl`;p=g.createProgram();[35633,35632].map((t,i)=>{g.shaderSource(s=g.createShader(t),i?`precision highp float;uniform vec3 r;void main(){float t=r.z,k=fract(t*2.),z=0.,s;vec3 d=normalize(vec3((gl_FragCoord.xy*2.-r.xy)/r.y,1)),p,c=d-d;d.xy*=mat2(cos(t*.2+vec4(0,11,33,0)));for(float i=0.;i<60.;i++)p=d*z,p.z+=t*2.,p.xy*=mat2(cos(p.z*.2+vec4(0,11,33,0))),s=dot(sin(p),cos(p.yzx))+.3*dot(sin(p*3.),cos(p.zxy*3.)),s=abs(s-k*k*.3+.3)*.4+.01,z+=s,c+=(cos(p.z*.3+z*.3+vec3(0,2,4))+1.2)/s;gl_FragColor=vec4(1.-exp(-c*c*(2.-k)/2e7),1);}`:`attribute vec4 p;void main(){gl_Position=p;}`);g.compileShader(s);g.attachShader(p,s)});g.linkProgram(p);g.useProgram(p);g.bindBuffer(34962,g.createBuffer());g.bufferData(34962,new Int8Array([-3,1,1,-3,1,1]),35044);g.enableVertexAttribArray(0);g.vertexAttribPointer(0,2,5120,0,0,0);a=new AudioContext;b=a.createBuffer(1,N=176400,22050);for(i=N;i--;)k=i%11025/11025,e=i%2756/2756,n=i/2756|0,w=i*.0627*2**((parseInt("037A37AF"[n%8],36)-[0,0,4,2][n>>4&3])/12),b.getChannelData(0)[i]=!/mute=1/.test(location)*(Math.sin(300*k**.5)*(1-k)**3+(Math.sin(w+2*(1-e)*Math.sin(w))*(1-e)+Math.sin(w/4)*.7)*k)/2;s=a.createBufferSource();s.buffer=b;s.loop=1;s.connect(a.destination);s.start();onclick=_=>a.resume();ondblclick=_=>document.fullscreenEnabled&&c.requestFullscreen();(onresize=_=>g.viewport(0,0,c.width=innerWidth,c.height=innerHeight))();(L=_=>{g.uniform3f(g.getUniformLocation(p,"r"),c.width,c.height,a.currentTime);g.drawArrays(4,0,3);requestAnimationFrame(L)})()</script>