1
resposta

FillStroke ou StrokeStyle (apenas mostrando)

<canvas width="600" height="400"></canvas> 

<script>
    var tela = document.querySelector('canvas'); 
    var pincel = tela.getContext('2d'); 

    function desenhaQuadrado(x, y, cor, borda) { 

        pincel.fillStyle = cor;
        pincel.strokeStyle = borda; 
        pincel.fillRect(x, y, 50, 50);
        pincel.strokeRect(x, y, 50, 50);
    }

        desenhaQuadrado(0, 0, 'pink', 'black'); 
        desenhaQuadrado(50, 50, 'yellow', 'black');
        desenhaQuadrado(0, 100, 'blue', 'black'); 
        desenhaQuadrado(100, 0, 'red', 'black');
        desenhaQuadrado(100, 100, 'orange', 'black');
</script>

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Eu coloquei 'black' apenas para questão de organização - eu iria me perder fácil. Mas compreendi bem! As cores foram escolhidas de forma aleatória também haha

1 resposta

Dahora mano!