createCanvas(400, 400);

}

​

function draw() {

  background('#B2D8E9');

for (let x = 0; x <= width; x += 20) {

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

ellipse (x, y, 25, 20);

}

}

//   upper left block

  if (mouseX<200 && mouseY<200){

   fill('#673AB7');

  }

//   lower right block

  else if (mouseX>200 && mouseY>200){

    fill('#3F51B5');

  }

//   lower left rgb(247,234,234)

  else if (mouseX<200 && mouseY>200)

    fill('#9C27B0');

//   upper right block

  else {

    fill('blue');

  }

//  when mouse is pressed

  if (mouseIsPressed){

    background('rgb(243,235,235)');

    for (let x=0; x<= width; x+=50) {

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

        ellipse(x,y,30,300);

      }

    }

  }

​

}