Solucionado
<canvas width="600" height="400"></canvas>
<script>
var tela = document.querySelector("canvas");
var pincel = tela.getContext("2d");
pincel.fillStyle = "green";
pincel.fillRect(0, 0, 600, 400);
pincel.fillStyle = "yellow";
pincel.beginPath();
pincel.moveTo(300, 400);
pincel.lineTo(0, 200);
pincel.lineTo(300, 0);
pincel.lineTo(600, 200);
pincel.lineTo(300, 400);
pincel.fill();
pincel.fillStyle = "darkblue";
pincel.beginPath();
pincel.arc(300, 200, 125, 0, 2 * 3.14);
pincel.fill();
</script>hoje, com a Alura e o Google Gemini
Olá Cezar,
Para ficar igual a nossa bandeira está quase certo, só falta um ajuste no tamanho do losango e do círculo azul. No caso da sua bandeira o losango amarelo está com o mesma largura e altura do quadrado verde, tanto que as pontas do losango estão encostando nas bordas verde. Mas no caso da bandeira (link) o losango amarelo é um pouco menor. Só fazer um ajuste nos pontos que ele desenha o losango que ai vai ficar igualzinho.
