let Cy = 200;

let Cx = 340;

​

function setup() {

  createCanvas(680, 400);

  noLoop();

}

​

function draw() {

  background(255);

  for (let i = 0; i<width; i+=rectL) {

    for (let j = 0; j<height; j+=rectL) {

      //setting randomness in position

      let randx, randy;

      //in the clockwise order, starting from top left:

      //first quadrant

      if (i <= Cx && j <= Cy) {

        randx = i;

        randy = j;

      }

      //second quadrant

      if (i >= Cx && j <= Cy) {

        randx = width - i;

        randy = j;

      }

      //third quadrant

      if (i >= Cx && j >= Cy) {

        randx = width - i;

        randy = height - j;

      }

      //fourth quadrant

      if (i <= Cx && j >= Cy) {

        randx = i;

        randy = height - j;

      }

      //increasing spread in the middle

      let x = i;

      let y = j;

      if (i >= 300 && i <= 360) {

        if (j >= 140 && j <= 260) {

          continue;

        }

      }

      //declaring boxes

      fill(randx, randy, randx + randy);

      //noStroke();

      rect(i + random(-randx/10, randx/10), j + random(-randy/10, randy/10), rectL, rectL);

    }

  }

}