Peach Hibiscus

// composition: single bloom at the upper-left thirds crossing, stem falling away lower-right; lower-left stays empty
// layering: pale halo wash, back petals, front petals, crimson eye, pen stamen last
const PALETTE = [
  "#f6efdf", // paper
  "#e8a087", // peach
  "#d97757", // deep peach
  "#8f3d33", // crimson eye
  "#5a6b4f", // leaf green
];

function petal(cx, cy, angle, len, wide, col, opacity, bleed) {
  push();
  translate(cx, cy);
  rotate(angle);
  brush.noStroke();
  brush.fillBleed(bleed, "out");
  brush.fillTexture(0.5, 0.6);
  brush.fill(col, opacity);
  brush.beginShape(0.7);
  brush.vertex(0, 0);
  brush.vertex(len * 0.38, -wide * (0.5 + random(-0.08, 0.08)));
  brush.vertex(len * (0.92 + random(-0.06, 0.06)), -wide * 0.34);
  brush.vertex(len * (1.04 + random(-0.05, 0.08)), wide * random(0.02, 0.14));
  brush.vertex(len * 0.62, wide * (0.42 + random(-0.07, 0.07)));
  brush.endShape(true);
  pop();
}

function setup() {
  createCanvas(800, 800, WEBGL);
  angleMode(DEGREES);
  brush.scaleBrushes(2.5);
  noLoop();
}

function draw() {
  translate(-width / 2, -height / 2);
  background("#f6efdf");

  const cx = 316;
  const cy = 302;

  // halo wash behind the bloom
  brush.noStroke();
  brush.fillBleed(0.55, "out");
  brush.fillTexture(0.4, 0.5);
  brush.fill("#e8a087", 26);
  brush.circle(cx + 14, cy + 8, 210, true);

  // stem first, so petals overlap it
  brush.set("2B", "#5a6b4f", 1.4);
  brush.beginShape(0.5);
  brush.vertex(cx + 30, cy + 60);
  brush.vertex(cx + 96, cy + 208);
  brush.vertex(cx + 132, cy + 356);
  brush.vertex(cx + 210, 690);
  brush.endShape(false);

  // one leaf off the stem
  brush.noStroke();
  brush.fillBleed(0.35, "out");
  brush.fillTexture(0.55, 0.6);
  brush.fill("#5a6b4f", 70);
  brush.beginShape(0.6);
  brush.vertex(cx + 108, cy + 250);
  brush.vertex(cx + 196, cy + 224);
  brush.vertex(cx + 262, cy + 262);
  brush.vertex(cx + 188, cy + 300);
  brush.endShape(true);

  // back petals — paler, wider, bleeding more
  petal(cx, cy, -156, 168, 96, "#e8a087", 60, 0.45);
  petal(cx, cy, -84, 178, 102, "#e8a087", 55, 0.5);
  petal(cx, cy, -18, 160, 92, "#e8a087", 62, 0.45);

  // front petals — deeper, two translucent passes each
  petal(cx, cy, 44, 172, 100, "#e8a087", 78, 0.35);
  petal(cx, cy, 47, 158, 88, "#d97757", 88, 0.3);
  petal(cx, cy, 118, 180, 106, "#e8a087", 78, 0.35);
  petal(cx, cy, 122, 166, 92, "#d97757", 92, 0.3);
  petal(cx, cy, -120, 150, 84, "#d97757", 70, 0.35);

  // crimson veins radiating from the eye into the front petals
  brush.set("pen", "#8f3d33", 0.5);
  brush.line(cx + 6, cy + 8, cx + 92, cy + 88);
  brush.line(cx - 2, cy + 10, cx + 34, cy + 112);
  brush.line(cx - 8, cy + 4, cx - 88, cy + 66);

  // crimson eye, pooling
  brush.noStroke();
  brush.fillBleed(0.5, "out");
  brush.fillTexture(0.7, 0.8);
  brush.fill("#8f3d33", 170);
  brush.circle(cx, cy, 34, true);
  brush.fill("#8f3d33", 120);
  brush.circle(cx + 4, cy - 3, 20, true);

  // stamen: one pen line reaching upper-right, pollen dots at the tip
  brush.set("pen", "#8f3d33", 0.9);
  brush.beginShape(0.35);
  brush.vertex(cx, cy);
  brush.vertex(cx + 74, cy - 78);
  brush.vertex(cx + 132, cy - 118);
  brush.endShape(false);
  brush.noStroke();
  brush.fill("#8f3d33", 150);
  brush.circle(cx + 138, cy - 124, 5, true);
  brush.circle(cx + 128, cy - 130, 4, true);
  brush.circle(cx + 146, cy - 114, 4, true);
  brush.circle(cx + 120, cy - 118, 3, true);

  // a dropped petal, far lower-left, almost gone
  petal(184, 648, 24, 96, 52, "#d97757", 34, 0.5);
}