['#152A3B', '#0D809C', '#F5C03E', '#D63826', '#EBEBD6'],

  ['#0F4155', '#5399A1', '#8CA96B', '#CB5548', '#E7E6F5'],

  ['#E8614F', '#F3F2DB', '#79C3A7', '#668065', '#4B3331'],

  ['#DBE5EC', '#336B87', '#2A3132', '#E94D35', '#EFAC55']

];

let queueNumber = [ 0, 1, 2, 3, 4 ];

let size = 128, 

    num = 10,

    i = 2,

    j = 1;

​

function setup() {

  createCanvas(480, 320);

  noLoop();

  noStroke();

  angleMode(DEGREES);

}

​

function draw() {

  background(200);

  let l = floor(size / num);

  let currentPalette = colorPalettes[i];

  for (let x = 0; x < size; x += l) {

    for (let y = 0; y < size; y += l) {

      shuffle(queueNumber, true);

      fill(currentPalette[queueNumber[0]]);

      rect(x, y, l, l);

      fill(currentPalette[queueNumber[1]]);      

      switch(round(random(0.51, 9.49))) {             

      //switch(random(1, 10)) {             

          case 1: triangle(x, y, x + l, y, x, y + l); break;

          case 2: triangle(x, y, x + l, y, x + l, y + l); break;

          case 3: triangle(x + l, y + l, x + l, y, x, y + l); break;

          case 4: triangle(x, y, x, y + l, x + l, y + l); break;

          case 5: arc(x + l/2, y + l/2, l, l, 0, 180); break;

          case 6: arc(x + l/2, y + l/2, l, l, 90, 270); break;

          case 7: arc(x + l/2, y + l/2, l, l, 180, 0); break;

          case 8: arc(x + l/2, y + l/2, l, l, 270, 90); break;

          case 9: ellipse(x + l/2, y + l/2, l, l); break;

      }

    }

  }

  paper();

}

​

​

function paper() {

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

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

      fill(random(175, 225), 25);

      rect(x, y, 2, 2);

    }

  }

}

​

function mouseReleased() {

  i = (i + 1) % 4;

  redraw();

}

​

function keyReleased() {

  if (keyCode >= 49 && keyCode <= 57) {

    num = Number(key);

    redraw();

  }

}