Cuadros con iteraciones... Llenado de tablero

Buenos días a tod@s, realice el llenado del tablero (la mitad) con cuadrados de 100 * 100

Cordial saludo y apretón de manos desde Medellín - Colombia

<h1>Llenando tablero con cuadrados _ loops</h1>

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

<script>

    function SaltarLineax4 () {

        document.write("<br><br><br><br>");
        document.write("Creado por: <h5>EstiwarZM</h5>");
        document.write("Asesoría de: <h5>Christian Velasco 'ONE = Oracle - Alura'</h5>");
    }

    //si lo que requerimos es realizar un llenado total con cuadrados al tablero, requeriremos de una loop, para evitar hacer un código demasiado largo, para esto utilizaremos while o for.

    function dibujarCuadrado(x,y,color){

        var pantalla = document.querySelector("canvas");
        var pincel = pantalla.getContext("2d");

        pincel.fillStyle = color;
        pincel.fillRect(x,y,100,100);
        pincel.strokeStyle = "black";
        pincel.strokeRect(x,y,100,100);

    }

    for(var x = 0; x < 600; x = x + 100){

        dibujarCuadrado(x,0,"yellow");
        dibujarCuadrado(x,100,"blue");
        dibujarCuadrado(x,200,"red");

    }

    SaltarLineax4();

</script>