<canvas width=600" height="400"></canvas>
<script>
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');
//cabeça
pincel.fillStyle = 'rgb(242, 212, 194)';
pincel.fillRect(0, 0, 600, 400);
//cabelo
pincel.fillStyle = '#582900';
pincel.beginPath();
pincel.fillRect(0, 0, 600, 100);
//cabelo 2
pincel.fillStyle = '#582900'
pincel.beginPath();
pincel.fillRect(0, 0, 120, 150);
//cabelo 3
pincel.fillStyle = '#582900';
pincel.beginPath();
pincel.fillRect(480, 0, 120, 150);
//olhos
pincel.fillStyle = '#fff';
pincel.fillRect(120, 160, 120, 50);
pincel.fillRect(380, 160, 100, 50);
//olhos 2
pincel.fillStyle = '#0033ff';
pincel.beginPath();
pincel.fillRect(120, 160, 60, 50)
pincel.fillRect(350, 160, 60, 50)
//nariz
pincel.fillStyle = '#996633'
pincel.fillRect(240, 220, 100, 50);
//barba
pincel.fillStyle = '#996633'
pincel.fillRect(160, 290, 60, 90);
pincel.fillRect(370, 290, 60, 90);
pincel.fillRect(160, 320, 270, 70);
</script>