​

function setup() {

  createCanvas(400, 300);

  pinkSky = color(252, 224, 217);

  blueSky = color(190, 228, 235);

}

​

function draw() {

  background(0);

    skyGradient(0, 0, width, height/1.5, blueSky, pinkSky, "COLOR");

    noStroke();

    fill(255);

    ellipse(mouseX, 75, 90, 90);

​

   //generative mountains

    fill(46, 130, 129); //mountain color

    beginShape();

    let xPerl = 0;

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

      let y = map(noise(xPerl), 0, 1, 200, 50);

      vertex(x, y);

      xPerl += 0.2;

    }

    yPerl += 0.2;

    vertex(width, height);

    vertex(0, height);

    endShape(CLOSE); 

  push();

    //trees

    for (var i = 0; i <= 400; i += 1) {

    stroke(162, 179, 137);

    strokeWeight(0.5);

    line(50, i + 50, i, height); //1st tree from the left

    line(100, i + 20, i + 50, height + 25); //second tree

    line(150, i + 70, i + 70, height + 50); //3rd tree

    line(225, i + 80, i + 200, height + 50); //4th tree

    line(width/2, i + 125, i + 150, height); //5th tree

    line(300, i + 60, i + 250, 300); //6th tree

    line(350, i + 100, i + 300, 350); //7th tree

    line(400, i + 100, i + 350, 400); //8th tree on far right

  }

  pop();

}

​

function skyGradient(x, y, w, h, pinkColor, blueColor, axis) {

  noFill();

  if (axis == "COLOR") {

    for(let i = y; i <= y + h; i++) {

      var mixedSky = map(i, y, y + h, 0, 1);

      var sky = lerpColor(pinkColor, blueColor, mixedSky);

      stroke(sky);

      line(x, i, x + w, i);

    }

  }

}