<canvas width="600" height="400"></canvas> <!-- O canvas é uma tela em branco. Usamos para começar a desenhar. Colocamos altura e largura -->
<script>
var tela = document.querySelector('canvas'); // aqui declaramos a variável tela, que será onde faremos a "arte" no html. querySelector para manipular a tag html "canvas"
var pincel = tela.getContext('2d'); // estamos informando que a variável pincel será o guia para pintar o canvas e trabalhará na dimensão 2d
pincel.fillStyle = 'lightgrey'; // estamos informando que o pincel preencherá o canvas na cor cinza claro
pincel.fillRect(0, 0, 600, 400); // estamos informando que o pincel preencherá o canvas desde o ponto zero de largura e altura até seus valores máximos.
</script>