const height = 396;

​

​

//https://coolors.co/c33149-80ff72-6c91bf-1b1b3a-fa7921 : Color Palette

​

const s = (p) => {

  const SQUARE_ROOT_TWO = p.sqrt(2);

  const NO_OF_TILES = 10;

​

  let side = width / (SQUARE_ROOT_TWO * NO_OF_TILES);

  let xSpacing = SQUARE_ROOT_TWO * side;

  let ySpacing = SQUARE_ROOT_TWO * side;

​

  const palette = ["#c33149", "#80ff72", "#6c91bf", "#1b1b3a", "#fa7921"];

  p.setup = () => {

    p.createCanvas(width, height);

    p.frameRate(24)

    p.noStroke();

    p.rectMode(p.CENTER);

  };

​

  p.draw = () => {

    let bg = 0 //p.int(p.random(1, 5));

    let fillColor = 1 //p.int(p.random(1, 5));

    p.fill(p.color(palette[fillColor]));

    p.background(p.color(palette[bg]));

​

    for (let i = 0; i < NO_OF_TILES; i++) {

      for (let j = 0; j < NO_OF_TILES; j++) {

        p.push();

        p.translate(xSpacing * i + xSpacing / 2, ySpacing * j + ySpacing / 2);

        let angle = p.random(p.HALF_PI);

        p.rotate(angle);

        p.rect(0, 0, side, side);

        p.pop();

      }

​

    }

  };

};

​

let myP5 = new p5(s);