p5.js Sketch

new p5((s) => {
  const COLS = 40;
  let W, H, ROWS, CW, CH, t = 0;

  s.setup = () => {
    const el = document.getElementById("p5-container");
    W = el.clientWidth;
    H = Math.round(W * (380 / 560));
    ROWS = Math.round(COLS * (H / W));
    CW = W / COLS;
    CH = H / ROWS;
    s.createCanvas(W, H).parent(el);
    s.colorMode(s.HSB, 360, 100, 100, 100);
    s.noStroke();
  };

  s.draw = () => {
    s.background(0, 0, 10, 18);
    const mx = s.mouseX / W;
    const my = s.mouseY / H;
    for (let col = 0; col < COLS; col++) {
      for (let row = 0; row < ROWS; row++) {
        const x = col * CW + CW / 2;
        const y = row * CH + CH / 2;
        const n = s.noise(col * 0.12, row * 0.12, t + mx * 0.5);
        s.fill((n * 360 + my * 120) % 360, 70, 95, 60 + n * 40);
        s.ellipse(x, y, n * CW * 0.9, n * CW * 0.9);
      }
    }
    t += 0.008;
  };
});