generative pattern example 1

  4/1/2024

*/

function setup() {

  createCanvas(400, 400);

  noStroke();

  var b = createButton("Generate pattern");

  b.mousePressed(pattern);

  pattern();

}

​

function pattern() {

  background(220);

  var cols = 24;

  var rows = 12;

  // size of each cell 

  var w = width / cols;

  var h = height / rows;

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

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

      var r = random(255);

      var g = random(200, 255);

      var b = random(255);

       fill(r, g, b);

      var xo = random(-w / 4, w / 4);

      var yo = random(-h / 2, h / 2);

      var wo = random(0, w * 2);

      var ho = random(0, h * 2);

      rect(x + xo, y + yo, w + wo, h + ho);

    }

  }

}