let reposition = space / 2;

​

function setup() {

  createCanvas(400, 400);

  noStroke();

  angleMode(DEGREES);

  colorMode(HSB);

  frameRate(1);

}

​

function draw() {

  background(0);

  generative();

}

​

function generative() {

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

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

      let generate = random(0.3);

      if (generate > 0 && generate < 0.1) {

        push();

        translate(x + reposition, y + reposition);

        rotate(y * 90);

        shape1(0, 0, generate * 450);

        pop();

      } else if (generate > 0.1 && generate < 0.2) {

        push();

        translate(x + reposition, y + reposition);

        rotate(x * 90);

        shape2(0, 0, generate * 700);

        pop();

      } else if (generate > 0.2 && generate < 0.3) {

        push();

        translate(x + reposition, y + reposition);

        rotate(x + y * 90);

        shape1(0, 0, generate * 500);

        pop();

      }

    }

  }

}

​

function shape1(x, y, f) {

  noFill();

  stroke(f, 100, 100);

  strokeWeight(random(1, 4));

  arc(x, y, space, space, 0, 180);

  noStroke();

  fill(f, 100, 100);

  arc(x, y, space / 2, space / 2, 0, 180);

}

​

function shape2(x, y, f) {

  noFill();

  stroke(f, 100, 100);

  strokeWeight(random(1, 4));

  triangle(x, y, x, y + space / 2, x + space / 2, y);

}

​