<canvas width="600" height="400"> 

</canvas>

<script>

    var tela = document.querySelector("canvas");
    var pincel = tela.getContext("2d");

    // canvas de 600 X 400
     pincel.fillStyle = "lightgrey";
     pincel.fillRect(0, 0, 600, 400);

     //Retângulo 1: 350, 300 (cabeça)
     pincel.fillStyle = "darkgreen";
     pincel.fillRect(0, 0, 350, 300);

     //Retângulos 2 e 3: 90, 90 (olhos).
     pincel.fillStyle = "black";
    //     (Coordenda X, Y, Largura(width), Altura(height)) - posicionando o pincel!
     pincel.fillRect(50, 50, 90, 90);  // Retangulo 2 - Olho
     pincel.fillRect(210, 50, 90, 90); // Retangulo 3 - Olho
     pincel.fillRect(140, 140, 70, 100); // Retangulo 4 - Nariz
     pincel.fillRect(100, 190, 40, 110); // Retangulo 5
     pincel.fillRect(210, 190, 40, 110); // Retangulo 6
     pincel.fill();

</script>