<canvas width="600" height="400"></canvas>
<script>
var tela = document.querySelector ('canvas');
var pincel = tela.getContext('2d');
pincel.fillRect (0, 0, 600, 400);
</script>
<canvas width="600" height="400"></canvas>
<script>
var tela = document.querySelector ('canvas');
var pincel = tela.getContext('2d');
pincel.fillRect (0, 0, 600, 400);
</script>
O tamanho da tela canvas é 600 por 400. Com a instrução pincel.fillRect (0, 0, 600, 400);, você desenhou um retangulo do tamanho da tela(canvas). Ela aparece em preto. Mude a cor com a instrução pincel.fillStyle='blue'; Teste, também, mudando o tamanho do retangulo para 300, 200 por exemplo.
<canvas width="600" height="400"></canvas>
<script>
var tela = document.querySelector ('canvas');
var pincel = tela.getContext('2d');
pincel.fillStyle='blue';
pincel.fillRect (0, 0, 600, 400);
</script>