Skip to content

Copper melange

Splitting rectangles according to the copper ratio (c = 4 + 1/c), inspired by @DaniLaura@mathstodon.xyz.

Click to re-render.

A colorful mess of rectangles

function setup() {
  createCanvas(600, 400);
  background(220);
  
  const colors = [
    color(190, 190, 180),
    color(50, 45, 55),
    color(120, 120, 140),
    color(100, 90, 95),
    color(230, 240, 240),
    color(0, 40, 0),
    color(30, 10, 50),
    color(190, 190, 180),
    color(50, 45, 55),
    color(120, 120, 140),
    color(100, 90, 95),
    color(230, 240, 240),
    color(0, 40, 0),
    color(30, 10, 50),
  ]
  // strokeWeight(0.5)
  // stroke(255)
  noStroke()
  
  const randShort = (w, h) => min(w / h, h / w) * 0.2
  const randFlip = 0.2
  const r = sqrt(5)-2
  rRect(0, 0, width, height, 0)

  function rRect(x,y,w,h, c) {
    if (w * h > 100) {
      if ((w > h) != (random() < randShort(w, h))) {
        let nw = w * r
        let c1 = 0
        if (x + w/2 > width/2) {
          nw = w - nw
          c1 = 1 - c1
        }
        if (random() < randFlip) {
          nw = w - nw
          c1 = 1 - c1
        }
        // rRect(x, y, nw, h, c * 2 + c1)
        // rRect(x + nw, y, w - nw, h, c * 2 + (1 - c1))
        rRect(x, y, nw, h, c + w * h * c1)
        rRect(x + nw, y, w - nw, h, c + w * h * (1 - c1))
      } else {
        let nh = h * r
        let c1 = 0
        if (y + h/2 > height/2) {
          nh = h - nh
          c1 = 1 - c1
        }
        if (random() < randFlip) {
          nh = h - nh
          c1 = 1 - c1
        }
        // rRect(x, y, w, nh, c * 2 + c1)
        // rRect(x, y + nh, w, h - nh, c * 2 + (1 - c1))
        rRect(x, y, w, nh, c + w * h * c1)
        rRect(x, y + nh, w, h - nh, c + w * h * (1 - c1))
      }
    } else {
      fill(colors[(c|0) % colors.length])
      stroke(colors[(c|0) % colors.length])
      rect(x,y,w,h)
    }
  }
}

(Originally seen at https://editor.p5js.org/bojidar-bg/sketches/5v5a7Vbut)

Experiments tagged p5 (69/85)

Experiments on this site (69/85)