let smallSqrSideL = 30;

let bigSqrSideL = smallSqrSideL * 2

let canvasS = 600;

​

​

function setup() {

  createCanvas(canvasS, canvasS);

​

  colors[1] = color(153, 58, 55);

  colors[0] = color(226, 230, 129)

  colors[2] = color(63, 113, 153)

​

}

​

function draw() {

  background(220);

  // rect(width / 2, height / 2, smallSqrSideL, smallSqrSideL)

  // rect(width / 2, height / 2, smallSqrSideL + smallSqrSideL, smallSqrSideL)

  // rect(width / 2, height / 2 - bigSqrSideL, bigSqrSideL, bigSqrSideL)

​

​

  let moves = {

    downBig: createVector(0, bigSqrSideL),

    downSmall: createVector(-smallSqrSideL, smallSqrSideL),

    rightSmall: createVector(smallSqrSideL, 0),

    // rightBig: createVector(bigSqrSideL, 0),

  };

​

​

  let place = createVector(0, 0);

  let tilingS = createVector(ceil(canvasS / 15), ceil(canvasS / 55))

​

  for (let c = 0; c < tilingS.y; c++) {

​

    let turn2 = c % 3;

    place.x = c * bigSqrSideL;

    place.y = -bigSqrSideL * 2 + turn2 * bigSqrSideL;

​

    for (let r = 0; r < tilingS.x; r++) {

      let turn = r % 3;

      fill(colors[turn]);

​

      if (turn == 0) {

        rect(place.x, place.y, bigSqrSideL, bigSqrSideL)

        place.add(moves["downBig"]);

​

      } else if (turn == 1) {

        rect(place.x, place.y, smallSqrSideL, smallSqrSideL)

        place.add(moves["rightSmall"]);

​

      } else if (turn == 2) {

        rect(place.x, place.y, smallSqrSideL, smallSqrSideL)

        place.add(moves["downSmall"]);

​

      }

    }

​

​

  }

​

}