Bruma Café

// Patrón generativo de círculos y elipses — Bruma Café
let circulos = 100;
let color1, color2, color3;

function setup() {
  createCanvas(800, 800);
  frameRate(2);            // un patrón nuevo cada medio segundo
  color1 = "#FFEECF";      // Beige
  color2 = "#421907";      // Marrón
  color3 = "#B37A62";      // Arcilla
}

function draw() {
  background(color1);
  for (let x = 0; x <= width; x += circulos) {
    for (let y = 0; y <= height; y += circulos) {
      fill(color2); noStroke();
      circle(x, y, random(0.3 * circulos, 1.2 * circulos));

      let rnd = random(1, 100);
      if (rnd <= 25) {         // elipse rellena, abajo-izquierda
        fill(color3); noStroke();
        ellipse(x - circulos * 0.25, y + circulos * 0.25,
                circulos * 0.45, circulos * 0.25);
      } else if (rnd <= 50) {  // rellena, abajo-derecha
        fill(color3); noStroke();
        ellipse(x + circulos * 0.25, y + circulos * 0.25,
                circulos * 0.45, circulos * 0.25);
      } else if (rnd <= 75) {  // silueta, arriba-izquierda
        noFill(); stroke(color3); strokeWeight(2);
        ellipse(x - circulos * 0.25, y - circulos * 0.25,
                circulos * 0.45, circulos * 0.25);
      } else {                 // silueta, arriba-derecha
        noFill(); stroke(color3); strokeWeight(2);
        ellipse(x + circulos * 0.25, y - circulos * 0.25,
                circulos * 0.45, circulos * 0.25);
      }
    }
  }
}

Código original del sketch (p5.js). El lienzo de abajo lo ejecuta adaptado al navegador.