Bandeira do Brasil

<meta charset="utf-8">

<canvas name="area" width="600" height="400"></canvas>

<script>

    var canvas = document.getElementsByName("area")[0];

    var brush = canvas.getContext("2d");

    function retangle(color, a, b, c, d) {

        brush.fillStyle = color;
        brush.fillRect(a, b, c, d);
    }

    function triangle(color, a, b, c, d, e, f) {

        brush.fillStyle = color;
        brush.beginPath();
        brush.moveTo(a, b), 
        brush.lineTo(c, d);
        brush.lineTo(e, f);
        brush.fill();
    }

    function circle(color, a, b, c) {

        brush.beginPath();
        brush.arc(a, b, c, 0, Math.PI * 2);
        brush.fillStyle = color;
        brush.fill();
    }

    retangle("green", 0, 0, 600, 400);

    triangle("yellow", 300, 50, 50, 200, 550, 200);
    triangle("yellow", 300, 350, 50, 200, 550, 200);

    circle("darkblue", 300, 200, 100);

</script>