Night Garden

// composition: stems rise from the bottom edge into a loose cluster right of center; upper-left kept dark and empty
// layering: deep ground washes, stems, glow halos, blossom cores, fireflies last
const PALETTE = [
  "#141b2b", // night ground
  "#0d1420", // deeper night
  "#7d8f7b", // stem grey-green
  "#e8e3d0", // moon pale
  "#d8845f", // ember blossom
];

function stem(baseX, topX, topY, weight) {
  brush.set("2B", "#7d8f7b", weight);
  brush.beginShape(0.55);
  brush.vertex(baseX, 810);
  brush.vertex(baseX + (topX - baseX) * 0.3 + randomGaussian(0, 9), 640 + randomGaussian(0, 14));
  brush.vertex(baseX + (topX - baseX) * 0.7 + randomGaussian(0, 9), (topY + 640) / 2);
  brush.vertex(topX, topY);
  brush.endShape(false);
}

function blossom(x, y, r, core) {
  brush.noStroke();
  brush.fillBleed(0.5, "out");
  brush.fillTexture(0.5, 0.5);
  brush.fill("#e8e3d0", 46);
  brush.circle(x, y, r * 2.6, true);
  brush.fill(core, 140);
  brush.circle(x + randomGaussian(0, 2), y + randomGaussian(0, 2), r * 1.25, true);
  brush.fill("#f2ead2", 200);
  brush.circle(x + randomGaussian(0, 1.5), y + randomGaussian(0, 1.5), r * 0.55, true);
}

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

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

  // deepen the ground toward the bottom, twice
  brush.noStroke();
  brush.fillBleed(0.4, "out");
  brush.fillTexture(0.5, 0.4);
  brush.fill("#0d1420", 150);
  brush.rect(400, 720, 860, 260, "center");
  brush.fill("#0d1420", 110);
  brush.rect(360, 600, 860, 200, "center");

  // stems: a cluster right of center, two strays left
  stem(430, 452, 372, 1.3);
  stem(468, 505, 328, 1.6);
  stem(512, 548, 405, 1.2);
  stem(556, 595, 300, 1.5);
  stem(596, 618, 430, 1.1);
  stem(238, 210, 505, 0.9);
  stem(150, 168, 585, 0.8);

  // blossoms at the stem tips; one ember among the pale
  blossom(452, 366, 17, "#e8e3d0");
  blossom(505, 320, 22, "#d8845f");
  blossom(548, 399, 14, "#e8e3d0");
  blossom(595, 291, 19, "#e8e3d0");
  blossom(618, 424, 12, "#e8e3d0");
  blossom(210, 499, 11, "#e8e3d0");
  blossom(168, 580, 8, "#e8e3d0");

  // seed heads: tiny pale ticks along two stems
  brush.set("pen", "#e8e3d0", 0.6);
  brush.line(468, 560, 476, 548);
  brush.line(474, 606, 483, 596);
  brush.line(509, 520, 517, 509);
  brush.line(554, 562, 561, 550);

  // fireflies drifting up and left, thinning out
  brush.noStroke();
  for (let i = 0; i < 26; i++) {
    const x = randomGaussian(360, 170);
    const y = randomGaussian(300, 130);
    const r = max(1.2, randomGaussian(2.4, 0.9));
    brush.fill("#e8e3d0", max(40, randomGaussian(110, 40)));
    brush.circle(x, y, r, true);
  }
}