​

function setup() {

  createCanvas(500, 600);

  stroke(255, 255, 255);

  strokeWeight(0.3);

  //noStroke()

  for (let x = 0; x <= 500; x += (random(7,10))){

      for (let y =0; y <=600; y +=10){

      push()

        translate(x,y);

        //the rotation makes everything squigglier and less even, which better approximates the uneveness of the mosaic tiles.

        rotate(random(-0.1,0.1));

        //stores the random number, which is used to determine how much of the canvas is what color, in a variable.

        let rN = random(100);

        //80% of the canvas will be the dominant color

        if (rN > 0){

          //will add dark blue

          fill(36, 49, 87);

        }if (rN> 50){

          //will add blue-black

          fill(27,33,50);

        }if (rN > 55 && rN <65){

          //will add grey

          fill(194,196,199);

        }if (rN > 80 && rN< 90){

          //will add aqua

          fill(117,172,184); 

        //}else if (rN > 60 && rN < 100) {

           //will add yellow

          //fill(222,209,122); 

        }if (rN > 90 && rN <100){

          //will add red

          fill(160, 40, 66);

​

        }

        rect(0,0, random(7,10), random(7,15));

        pop()

        }

        }

    //this loop draws some yellow squares

   for (let a = 50; a <= 500; a += random(0,100)){

      for (let b =50; b <=600; b +=100){

        push()

        translate(a,b);

        rotate(random(-0.1,0.1));

        fill(222,209,122); 

        rect(0,0, random(7,10), random(7,15));

        pop()

        }

        }

//these other loops add squares of different colors

   for (let c = 60; c <= 500; c += 100){

      for (let d =60; d <=600; d +=random(100,200)){

        push()

        translate(c,d);

        rotate(random(-0.1,0.1));

        fill(164,129,187); 

        rect(0,0, random(7,10), random(7,15));

        pop()

        }

        }

   for (let e = 70; e <= 500; e += 70){

      for (let f =70; f <=600; f +=random(200,300)){

        push()

        translate(e,f);

        rotate(random(-0.1,0.1));

        fill(221,99,62); 

        rect(0,0, random(7,10), random(7,15));

        pop()

        }

        }

    for (let g = 80; g <= 500; g += random(200,300)){

      for (let h =70; h <=600; h += 80){

        push()

        translate(g,h);

        rotate(random(-0.1,0.1));

        fill(134,192,170); 

        rect(0,0, random(7,10), random(7,15));

        pop()

        }

        }

}

​

function mouseClicked(){

  setup()

​

}

function draw() {

  //background(220);

}