<canvas width="600" height="400"></canvas>
<script>
var pantalla = document.querySelector("canvas");
var pincel = pantalla.getContext("2d");
function ojo(x, y) {
pincel.fillStyle = "black";
pincel.fillRect(x, y, 90, 90);
}
function rostro(x, y) {
pincel.fillStyle = "darkgreen";
pincel.fillRect(x, y, 350, 300);
}
function boca(x, y) {
pincel.fillStyle = "black";
pincel.fillRect(x, y, 40, 110);
}
function nariz(x, y) {
pincel.fillStyle = "black";
pincel.fillRect(x, y, 70, 100);
}
rostro(0, 0);
ojo(51, 55); // ojos izquierdo
ojo(209, 55); // ojos derecho
nariz(140, 145);
boca(101, 190); // BocaLadoIzquierdo
boca(210, 190); // BocaLadoDerecho
</script>