<canvas width = "600" height = "400"></canvas>
<script>
function desenhaQuadrado(x, y, tamanho, cor){
var tela = document.querySelector("canvas");
var pincel = tela.getContext("2d");
pincel.fillStyle = cor;
pincel.fillRect(x, y, tamanho, tamanho); // desenha i retangulo de lados iguais que é um quadrado.
pincel.fillStroke = "black";
pincel.strokeRect(x, y, tamanho, tamanho);
}
var x = 0;
var tamanho = 50;
while(x < 150){
desenhaQuadrado(x,0,tamanho,"green"); // faz os tres quadrados verdes.
x = x + 50;
}
desenhaQuadrado(x,0,tamanho,"white");// faz o quadrado branco.
</script>
