uniform vec2 uRes; // canvas size (internal px) uniform float uScale; // internal px per CSS px uniform float uTime; // seconds uniform vec2 uView; // viewport (CSS px) uniform vec2 uSrc; // beam source, off-screen upper-left uniform vec2 uEntry; // beam meets the prism's left face uniform vec2 uExit; // spectrum leaves the prism's right face uniform float uDir; // spectrum direction (radians, y down) uniform float uSpread; // band half-width growth per px travelled uniform float uBeamT; // intro progress 0..1 uniform float uFanT; uniform float uGlassT; uniform vec2 uPtr; // spring-smoothed pointer, -1..1 uniform vec3 uPrism; // prism centre (x, y) and size uniform vec4 uPanel; // content panel rect (x, y, w, h); w = 0 disables the lens uniform float uRadius; // panel corner radius uniform vec4 uKeep[4]; // small body text boxes in the panel (x, y, w, h): no caustics behind them float hash(vec2 p) { p = fract(p * vec2(123.34, 456.21)); p += dot(p, p + 45.32); return fract(p.x * p.y); } float vnoise(vec2 p) { vec2 i = floor(p); vec2 f = fract(p); vec2 u = f * f * (3.0 - 2.0 * f); return mix(mix(hash(i), hash(i + vec2(1.0, 0.0)), u.x), mix(hash(i + vec2(0.0, 1.0)), hash(i + vec2(1.0, 1.0)), u.x), u.y); } // distance to the nearest Voronoi cell edge (F2 - F1); the cell points orbit slowly with t float cellEdge(vec2 p, float t) { vec2 i = floor(p); vec2 f = fract(p); float d1 = 8.0; float d2 = 8.0; for (int y = -1; y <= 1; y++) { for (int x = -1; x <= 1; x++) { vec2 g = vec2(float(x), float(y)); vec2 h = vec2(hash(i + g), hash(i + g + 17.31)); vec2 o = 0.5 + 0.38 * sin(t + 6.2831 * h); float d = length(g + o - f); if (d < d1) { d2 = d1; d1 = d; } else if (d < d2) { d2 = d; } } } return d2 - d1; } // Caustic light network: bright filaments on the cell edges of two slowly drifting, domain-warped Voronoi // layers, bold enough to survive the panel's frost. Normalised to a mean of 1 (the pattern's measured mean // is 0.500), so multiplying light by it only redistributes the light into filaments: the average // brightness is unchanged. Filaments drift at most ~15 px/s. float caustic(vec2 p, float t) { vec2 w = p + 0.35 * vec2(vnoise(p * 0.6 + t * 0.05), vnoise(p * 0.6 - t * 0.05 + 4.1)); float e1 = cellEdge(w, t * 0.35); float e2 = cellEdge(w * 2.0 + 3.7, t * 0.5); return 0.3 + 0.7 * 1.999 * (exp(-e1 * 5.0) + 0.4 * exp(-e2 * 6.0)); } // visible spectrum, 0 = red (top of the band) .. 1 = violet (bottom) vec3 spectrum(float t) { float r = 1.0 - smoothstep(0.05, 0.62, t) + 0.38 * smoothstep(0.82, 1.0, t); float g = smoothstep(0.06, 0.38, t) * (1.0 - smoothstep(0.50, 0.86, t)); float b = smoothstep(0.42, 0.78, t) * (1.0 - 0.25 * smoothstep(0.90, 1.0, t)); return vec3(r, g, b); } mat2 rot(float a) { float c = cos(a); float s = sin(a); return mat2(c, -s, s, c); } float sdBox(vec2 p, vec2 b, float r) { vec2 q = abs(p) - b + r; return length(max(q, 0.0)) + min(max(q.x, q.y), 0.0) - r; } float sdTri(vec2 p, float r) { float k = 1.7320508; p.x = abs(p.x) - r; p.y = p.y + r / k; if (p.x + k * p.y > 0.0) p = vec2(p.x - k * p.y, -k * p.x - p.y) / 2.0; p.x -= clamp(p.x, -2.0 * r, 0.0); return -length(p) * sign(p.y); } float boxShape(vec2 p, vec2 c, float a, vec2 b, float r) { return sdBox(rot(a) * (p - c), b, r); } float triShape(vec2 p, vec2 c, float a, float s, float r) { return sdTri(rot(a) * (p - c), s) - r; } // Glass lit by the same upper-left light as the beam: a white specular rim that is bright only on the // edge facing the light, a faint inner reflection, colour only as dispersion fringes at the very edge, // and a deep blue body with a soft glow just inside the lit edge. vec3 glass(float d, vec2 n, float soft) { vec2 toLight = vec2(-0.864, -0.504); float lit = smoothstep(-0.25, 0.85, dot(n, toLight)); float w = 1.1 + soft; vec3 rim = vec3(exp(-abs(d - 2.2) / w), exp(-abs(d) / w), exp(-abs(d + 2.2) / w)); float inner = exp(-abs(d + 11.0) / (2.4 + soft)) * 0.30; float ang = atan(n.y, n.x); vec3 irid = mix(vec3(0.55, 0.62, 1.0), vec3(0.95, 0.55, 1.0), 0.5 + 0.5 * sin(ang * 2.0 + 1.3)); vec3 spec = mix(vec3(1.0, 0.99, 0.97), irid, 0.42); vec3 rimCol = (rim * (0.12 + 0.88 * lit) + inner * lit) * spec * 0.34; float inside = 1.0 - smoothstep(-soft - 1.0, soft + 1.0, d); vec3 body = vec3(0.014, 0.026, 0.080) * inside; body += vec3(0.11, 0.07, 0.24) * inside * exp(d / 120.0) * lit * 0.7; return rimCol + body; } vec3 scene(vec2 p, float inPanel) { float t = uTime; vec3 col = vec3(0.0196, 0.0196, 0.0235); // ---- iridescent glass forms at the frame edges, visibly floating and turning ---- // (on entrance each one floats in from beyond its edge and settles as uGlassT eases to 1) vec3 g = vec3(0.0); vec2 ex = vec2(1.5, 0.0); vec2 ey = vec2(0.0, 1.5); float gin = 1.0 - uGlassT; { vec2 c = vec2(uView.x * 0.05, uView.y * 1.05) + uPtr * vec2(-14.0, -9.0) + vec2(sin(t * 0.16) * 60.0, cos(t * 0.13) * 34.0) + gin * vec2(-70.0, 50.0); float a = -0.38 + 0.12 * sin(t * 0.11); vec2 b = vec2(uView.x * 0.34, uView.y * 0.10); float d = boxShape(p, c, a, b, 60.0); vec2 n = normalize(vec2(boxShape(p + ex, c, a, b, 60.0) - boxShape(p - ex, c, a, b, 60.0), boxShape(p + ey, c, a, b, 60.0) - boxShape(p - ey, c, a, b, 60.0)) + 1e-5); g += glass(d, n, 7.0); } { vec2 c = vec2(uView.x * 0.98, -uView.y * 0.04) + uPtr * vec2(-10.0, -7.0) + vec2(cos(t * 0.12) * 50.0, sin(t * 0.15) * 40.0) + gin * vec2(60.0, -50.0); float a = 0.62 + 0.10 * sin(t * 0.09 + 1.0); float s = uView.x * 0.19; float d = triShape(p, c, a, s, 18.0); vec2 n = normalize(vec2(triShape(p + ex, c, a, s, 18.0) - triShape(p - ex, c, a, s, 18.0), triShape(p + ey, c, a, s, 18.0) - triShape(p - ey, c, a, s, 18.0)) + 1e-5); g += glass(d, n, 10.0) * 0.9; } { vec2 c = vec2(uView.x * 0.80, uView.y * 1.00) + uPtr * vec2(-6.0, -4.0) + vec2(sin(t * 0.10) * 70.0, cos(t * 0.14) * 16.0) + gin * vec2(0.0, 60.0); float a = 0.10 + 0.08 * sin(t * 0.12 + 2.0); vec2 b = vec2(uView.x * 0.42, 18.0); float d = boxShape(p, c, a, b, 18.0); vec2 n = normalize(vec2(boxShape(p + ex, c, a, b, 18.0) - boxShape(p - ex, c, a, b, 18.0), boxShape(p + ey, c, a, b, 18.0) - boxShape(p - ey, c, a, b, 18.0)) + 1e-5); g += glass(d, n, 4.0) * 0.8; } col += g * uGlassT; // ---- soft key light around the prism ---- float kd = length(p - uPrism.xy); col += vec3(1.0, 0.985, 0.96) * 0.055 * exp(-kd / (uPrism.z * 0.75)) * uGlassT; // ---- the spectrum: leaves the right face, widens as it travels, light flows outward ---- vec2 dv = vec2(cos(uDir), sin(uDir)); vec2 nv = vec2(-dv.y, dv.x); vec2 v = p - uExit; float a = dot(v, dv); if (a > -40.0) { float aa = max(a, 0.0); float hw = max(8.0 + aa * uSpread, 1.0); float cx = dot(v, nv); float x = cx / hw; float band = 1.0 - smoothstep(0.70, 1.12, abs(x)); float halo = exp(-abs(x) * 1.35) * 0.22; float front = smoothstep(0.0, 90.0, uFanT * uView.x * 1.3 - aa); float fade = exp(-aa / 1600.0); float streak = 0.88 + 0.12 * vnoise(vec2(aa * 0.006 - t * 0.35, x * 2.5 + 7.0)); vec3 sc = spectrum(clamp(x * 0.5 + 0.5, 0.0, 1.0)); sc = mix(sc, vec3(1.0), exp(-aa / 110.0) * 0.6); float emerge = smoothstep(-40.0, 12.0, a); // behind the glass panel the band ripples into caustics, each channel sampled a little apart along the // band normal so the filaments carry rainbow fringes. Under the small body text (uKeep rects) the light // stays unrippled and is dimmed by half, so body text keeps its contrast wherever the light is aimed. vec3 cz = vec3(1.0); float dim = 1.0; if (inPanel > 0.5 && abs(x) < 4.0) { float keep = 0.0; for (int k = 0; k < 4; k++) { vec4 kr = uKeep[k]; vec2 kd = max(abs(p - kr.xy - kr.zw * 0.5) - kr.zw * 0.5, 0.0); keep = max(keep, 1.0 - smoothstep(0.0, 18.0, length(kd))); } dim = 1.0 - 0.5 * keep; if (keep < 0.999 && abs(x) < 2.6) { vec2 cp = p / 110.0; vec2 off = nv * ((6.0 + 4.0 * abs(x)) / 110.0); cz = mix(vec3(caustic(cp + off, t), caustic(cp, t), caustic(cp - off, t)), vec3(1.0), keep); } } col += sc * cz * (band * 0.85 + halo) * fade * streak * front * emerge * 0.8 * dim; // coloured motes streaming outward, each riding its own lane of the band float sp = 40.0; float u = aa - t * 70.0; float cell = floor(u / sp); float along = (fract(u / sp) - 0.5) * sp; float h1 = hash(vec2(cell, 7.7)); float h2 = hash(vec2(cell, 9.1)); float lane = (h2 * 2.0 - 1.0) * 0.8; float across = cx - lane * hw; float m = exp(-(along * along + across * across) / 4.5) * step(0.45, h1); col += mix(spectrum(lane * 0.5 + 0.5), vec3(1.0), 0.35) * m * 0.7 * fade * front * emerge * dim; } // ---- the white beam: draws in from the source, light motes ride it into the prism ---- vec2 se = uEntry - uSrc; float L = length(se); vec2 bd = se / L; vec2 bn = vec2(-bd.y, bd.x); vec2 ps = p - uSrc; float tbr = dot(ps, bd); float tb = clamp(tbr, 0.0, L); float db = length(p - (uSrc + bd * tb)); float drawn = smoothstep(0.0, 30.0, uBeamT * L - tb); float core = exp(-db * db / 5.0); float glow = exp(-db / 16.0) * 0.16 + exp(-db / 60.0) * 0.05; float flow = 0.90 + 0.10 * vnoise(vec2(tb * 0.01 - t * 0.6, 3.0)); col += vec3(1.0, 0.97, 0.93) * (core * 0.95 + glow) * flow * drawn; if (tbr > 0.0 && tbr < L) { float sp2 = 52.0; float u2 = tbr - t * 85.0; float cell2 = floor(u2 / sp2); float along2 = (fract(u2 / sp2) - 0.5) * sp2; float h = hash(vec2(cell2, 3.1)); float across2 = dot(ps, bn) - (h - 0.5) * 9.0; float m2 = exp(-(along2 * along2 + across2 * across2) / 3.5) * step(0.4, h); col += vec3(1.0, 0.97, 0.92) * m2 * 0.55 * drawn * (1.0 - smoothstep(L - 40.0, L, tbr)); } return col; } void main() { vec2 fc = gl_FragCoord.xy; vec2 p = vec2(fc.x, uRes.y - fc.y) / uScale; vec3 col; // ---- liquid glass over the content panel: the rim bends the scene, with dispersion ---- vec2 pc = uPanel.xy + uPanel.zw * 0.5; vec2 hb = uPanel.zw * 0.5; float dP = uPanel.z > 1.0 ? sdBox(p - pc, hb, uRadius) : 1.0; if (dP < 0.0) { vec2 q = pc + (p - pc) * 0.985; float band = 34.0; if (-dP < band) { vec2 e = vec2(1.0, 0.0); vec2 n = normalize(vec2(sdBox(p + e.xy - pc, hb, uRadius) - sdBox(p - e.xy - pc, hb, uRadius), sdBox(p + e.yx - pc, hb, uRadius) - sdBox(p - e.yx - pc, hb, uRadius)) + 1e-5); float k = 1.0 - (-dP / band); float amt = 30.0 * k * k; col = vec3(scene(q + n * amt, 1.0).r, scene(q + n * amt * 1.18, 1.0).g, scene(q + n * amt * 1.38, 1.0).b); } else { col = scene(q, 1.0); } } else { col = scene(p, 0.0); } // ---- vignette, soft tone curve, static dither against banding ---- vec2 vv = p / uView - 0.5; col *= 1.0 - 0.55 * smoothstep(0.38, 0.95, length(vv * vec2(1.0, 1.2))); col = 1.0 - exp(-col * 1.15); col += (hash(fc) - 0.5) / 255.0; gl_FragColor = vec4(col, 1.0); }

Your key is ready.Your key is ready.

Your key is ready.