JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="myCanvas" width="1400" height="900">
</canvas>

JavaScript

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.strokeStyle = "#00C800";

function line(x, y, x2, y2) {
    ctx.beginPath();
    ctx.moveTo(x, y);
    ctx.lineTo(x2, y2);
    ctx.stroke();
}

var aa = -Math.PI / 3; //Angle a.
var ab = (11 * Math.PI) / 36;  //Angle b.

function drawStem(x, y, angle, lineLength){
  if(lineLength > 1){
      var endX = x + (lineLength * Math.cos(angle));
      var endY = y + (lineLength * Math.sin(angle));
      line(x, y, endX, endY);

      drawStem(endX, endY, angle + 0.05, lineLength * 0.9); //Main stem.
      drawStem(x + (endX - x)/3, y + (endY - y)/3, angle + ab, lineLength / 3); //Bottom leafs.
      drawStem(endX, endY, angle + aa, lineLength / 3); //Top leafs.
  }
}

drawStem(0, c.height / 3, 0, 150);