<meta charset="utf-8">
<canvas width="600" height="400"> </canvas>
<Script>
var pantalla = document.querySelector("canvas"); // con esto conecto la etiqueta canvas
var pincel = pantalla.getContext("2d"); // pincel donde le pasamos lo que tiene la pantalla y en 2 dimensiones.
pincel.fillStyle = "lightgrey";
pincel.fillRect (0,0,600,400); // esto es una función del objeto pincel (en programación orientada a objetos conocida como método) por eso luego van parentesis. Es una función (método) del objeto pincel que en nuestro código la usábamos para diseñar (dibujar) las figuras.
pincel.fillStyle = "darkgreen";
pincel.fillRect (120,45,350,300); // cabeza
pincel.fillStyle = "black";
pincel.fillRect (170,100,90,90); // ojo izq
pincel.fillRect (330,100,90,90); // ojo dcho
pincel.fillRect (260,190,70,100); // nariz
pincel.fillRect (220,235,40,110); // boca izq
pincel.fillRect (330,235,40,110); // boca dcha
</Script>
Saludos!