Bandeira do Brasil completa (com faixa, estrelas e frase)

Tentei ir além e criei uma função para criar cada estrela da bandeira. Pesquisei como criar desenhos com curvas e utilizei curvas quadráticas de bezier. Tentei posicionar as estrelas o mais parecido possível com a bandeira oficial. Utilizei também um loop for para criar as 27 estrelas, com as coordenadas armazenadas em um vetor. Segue o código e a bandeira.

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

<script>
    function createStar(x, y) {
        pincel.beginPath();
        pincel.moveTo(x, y);
        pincel.lineTo(x-2, y);
        pincel.lineTo(x-1, y+2);
        pincel.lineTo(x-2, y+4);
        pincel.lineTo(x+1, y+3);
        pincel.lineTo(x+4, y+4);
        pincel.lineTo(x+3, y+2);
        pincel.lineTo(x+4, y);
        pincel.lineTo(x+2, y);
        pincel.lineTo(x+1, y-2);
        pincel.fill();
    }

    // Variáveis de apoio

    const tela = document.querySelector('canvas');
    const pincel = tela.getContext('2d');

    // Retângulo verde

    pincel.fillStyle = 'green';
    pincel.fillRect(0, 0, 600, 400);

    // Losango amarelo

    pincel.fillStyle = 'yellow';
    pincel.beginPath();
    pincel.moveTo(30, 200);
    pincel.lineTo(300, 360);
    pincel.lineTo(570, 200);
    pincel.lineTo(300, 40);
    pincel.fill();

    // Círculo azul

    pincel.fillStyle = 'darkblue';
    pincel.beginPath();
    pincel.arc(300, 200, 100, 0, 2*Math.PI);
    pincel.fill();

    // Faixa

    pincel.fillStyle = 'white';
    pincel.beginPath();
    pincel.moveTo(200, 190);
    pincel.quadraticCurveTo(300, 175, 400, 190);
    pincel.quadraticCurveTo(400, 200, 400, 210);
    pincel.quadraticCurveTo(300, 195, 200, 210);
    pincel.quadraticCurveTo(200, 200, 200, 190);
    pincel.fill();

    // Frase da faixa

    pincel.fillStyle = 'green';
    pincel.font = '11px serif';
    pincel.fillText('ORDEM E PROGRESSO', 237, 198);

    // Estrelas

    const points = [
        [210,215], [223,250], [231,243], [239, 236], [265, 225],
        [245, 250], [242, 260], [255, 265], [290, 240], [296, 250],
        [300, 260], [310, 240], [300, 230], [299, 280], [325, 210],
        [330, 175], [335, 255], [343, 265], [351, 256], [365, 248],
        [365.5, 256], [365, 264], [375, 249], [381, 243], [385, 234],
        [380, 224], [392, 224]
    ];

    pincel.fillStyle = 'white';
    for (const [x,y] of points) {
        createStar(x, y);
    }

</script>