createCanvas(400, 400);

​

// grid of circles in the back

  let positionBackCirclesX;

  let positionBackCirclesY; 

  if(mouseIsPressed){

    fill(32, 109, 160,80);

    noStroke();

  for (positionBackCirclesY = 25; positionBackCirclesY < height; positionBackCirclesY=positionBackCirclesY + 39) {

    for (positionBackCirclesX = 20; positionBackCirclesX<width; positionBackCirclesX=positionBackCirclesX + 40) {

      circle(positionBackCirclesX,positionBackCirclesY, 60);

    }

  } 

  }

  else{

    noFill();

stroke(175);

strokeWeight(1);

    for (positionBackCirclesY = 20; positionBackCirclesY < height; positionBackCirclesY=positionBackCirclesY + 30) {

    for (positionBackCirclesX = 20; positionBackCirclesX<width; positionBackCirclesX=positionBackCirclesX + 30) {

      circle(positionBackCirclesX,positionBackCirclesY, 30);

  }

    }

  }

​

​

// randomly organized overlapping circles 

  frameRate(8);

  for (let circles=0; circles<75;circles++) {

  let xPosition = random(width);

  let yPosition = random(height);

  let radius = random(1,50);

  fill(133,182,27,200);

  noStroke();

  circle(xPosition, yPosition, radius);

}

  }