const rings = [];

​

function setup () {

  createCanvas(500, 500);

  noSmooth();

​

  hue = random(0, 360);

  const count = floor(random(10, 20));

  for (let i = 0; i < count; i++) {

    const diameter = ((i + 1) / count);

    const arcLength = random(PI * 0.05, PI * 2);

    const arcAngle = random(-PI * 2, PI * 2);

    const spinSpeed = random(-2, 2);

    rings.push({spinSpeed,diameter,arcLength,arcAngle});

  }

​

​

​

}

​

function draw () {

//using lerp here for a gradient background

const m = 100;

  const topR = 255 * noise(frameCount / m);

  const topG = 255 * noise(1000 + frameCount / m);

  const topB = 255 * noise(2000 + frameCount / m);

  const bottomR = 255 * noise(3000 + frameCount / m);

  const bottomG = 255 * noise(4000  + frameCount / m);

  const bottomB = 255 * noise(5000 + frameCount / m);

​

  const topColor = color(topR, topG, topB);

  const bottomColor = color(bottomR, bottomG, bottomB);

  for(let y = 0; y < height; y++) {

    const lineColor = lerpColor(topColor, bottomColor, y / height);

​

    stroke(lineColor);

    line(0, y, width, y);

  }

  const minDim = Math.min(450, 450);

  noFill();

  strokeWeight(minDim * 0.015);

  strokeCap(ROUND);

  stroke(255);

​

  let d = minDim;

  d -= d * 0.1;

  for (let i = 0; i < rings.length; i++) {

    const {diameter,arcLength,arcAngle,spinSpeed} = rings[i];

    const spin = millis() / 500 * spinSpeed;

    arc(width / 2,height / 2,diameter * d,diameter * d,spin + arcAngle, spin + arcAngle + Math.PI * arcLength);

  }

}

​