97

Voronoi Crystals

A 3D layered voronoi structure that shifts based on time and mouse position.

60 FPS WebGPU

WGSL Shader Source

struct Uniforms { resolution: vec2f, time: f32, padding: f32, mouse: vec2f, }
@group(0) @binding(0) var<uniform> u: Uniforms;
@vertex fn vs_main(@builtin(vertex_index) vi: u32) -> @builtin(position) vec4f {
  let pos = array(vec2f(-1.0,-1.0), vec2f(3.0,-1.0), vec2f(-1.0,3.0)); return vec4f(pos[vi], 0.0, 1.0);
}
fn hash2(p: vec2f) -> vec2f {
  var q = vec2f(dot(p, vec2f(127.1,311.7)), dot(p, vec2f(269.5,183.3)));
  return fract(sin(q)*43758.5453);
}
@fragment fn fs_main(@builtin(position) fc: vec4f) -> @location(0) vec4f {
  var uv = (fc.xy - 0.5*u.resolution) / u.resolution.y;
  uv = uv * 5.0 + u.mouse * 2.0;
  var m = 1.0;
  for(var j=-1; j<=1; j++) {
    for(var i=-1; i<=1; i++) {
      let g = vec2f(f32(i), f32(j));
      let o = hash2(floor(uv) + g);
      let p = g + 0.5 + 0.5*sin(u.time + 6.2831*o) - fract(uv);
      let d = dot(p,p);
      if(d < m) { m = d; }
    }
  }
  let c = sqrt(m);
  return vec4f(c*0.4, c*0.8, c*1.2, 1.0);
}

Properties

#webgpu#voronoi#crystals
Author: Math Art Core Target: 60 FPS
ESC
↑↓ Navigate Select
101 Mathematical Artworks

Support the Project

Keep mathematical creative coding alive & open source

Or via Direct Payoneer ($0 Fee)
Payoneer Customer ID: $0 Fee Direct
24076084

💡 Payoneer app: Go to Pay → Pay to recipient → Enter ID 24076084.

Thank you for supporting generative mathematical animations! ✨