Mis triangulos. Ligeramente diferente el codigo al sugerido

<canvas width="500" height ="450">    // esto es alto y largo</canvas>


<script>
    document.write("<h2>Holi mor</h3>")

    var display = document.querySelector("canvas");
    var drawPincel = display.getContext("2d"); //este es el pincel


    drawPincel.fillStyle = "pink";
    drawPincel.fillRect(0,0,500,450);

    drawPincel.fillStyle = "black";
    drawPincel.beginPath();
    drawPincel.moveTo(50,50);
    drawPincel.lineTo(50,400);
    drawPincel.lineTo(400,400);
    drawPincel.moveTo(50,400);
    drawPincel.lineTo(400,400);
    drawPincel.fill();

    drawPincel.fillStyle = "pink";
    drawPincel.beginPath();
    drawPincel.moveTo(100,175);
    drawPincel.lineTo(100,350);
    drawPincel.lineTo(275,350);
    drawPincel.moveTo(100,350);
    drawPincel.lineTo(275,350);
    drawPincel.fill();

</script>