let colors = [];

let baseAngle = 0;

​

function setup() {

  createCanvas(400, 400);

  noStroke();

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

    let redShade = map(i, 0, numCircles - 1, 40, 40); // Vary red component to add purple tint

    let blueShade = map(i, 0, numCircles - 100, 200, 255); // Vary blue component

    let whiteShade = map(i, 0, numCircles - 1, 240, 255); // Vary white component

    let c = color(redShade, 0, blueShade, whiteShade); // Create color with varying shades

    colors.push(c);

  }

}

​

function draw() {

  background(0); // Set background to black

  let maxDiameter = width * 0.75; // Maximum size of the largest circle

  for (let i = numCircles - 1; i >= 0; i--) {

    let angle = baseAngle + i * 0.2;  // Adding delay based on circle index

    let diameter = maxDiameter * 0.5 * (1 + 0.5 + sin(angle) * 0.25); // Ensuring minimum size

    // Calculate transparency based on diameter

    let transparency = map(diameter, 0, maxDiameter, 0, 100);

    // Set fill color with adjusted transparency and color from colors array

    fill(red(colors[i]), green(colors[i]), blue(colors[i]), transparency);

    // Draw circle at the center of the canvas

    ellipse(width / 2, height / 2, diameter);

    maxDiameter *= 0.8; // Decrease the maximum diameter for the next circle

  }

  baseAngle += 0.01;  // Increment baseAngle for animation effect

}

​