Resumo em tag de cada forma geometrica

Bom, vendo a aula 07 A vida não é só feita de retângulos! me surgiu a dúvida, "E se eu quiser um losango?", bom, fui tirar a dúvida e, usando apenas um beginPath, não consegui fazer um losango, não sei se teria uma tag em específico para o losango, mas fiz ele a partir de duas beginPath, ou seja, dois triângulos um voltado para cima e outro para baixo. Em sumo, minha duvida se volta para saber se tem uma forma de resumir cada forma geométrica com tags, da mesma forma que beginPath mostra triângulos e o fillRect quadrados, teríamos tags para cada forma geométrica?

Fiz meu losango da seguinte forma:

<meta charset="UTF-8">

<canvas width="1350" height="609"></canvas>

<script>

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


    pincel.fillStyle = "#fafad2";
    pincel.fillRect(0, 0, 1350, 609);

    pincel.fillStyle = "#800000";
    pincel.fillRect(0, 0, 450, 609);

    pincel.fillStyle = "#C0C0C0";
    pincel.fillRect(900, 0, 450, 609);

    pincel.fillStyle = "#c1acbb";
    pincel.beginPath();
    pincel.moveTo (450, 304);
    pincel.lineTo(675, 504);
    pincel.lineTo(900, 304)
    pincel.fill();
//Triangulo voltado para baixo

    pincel.fillStyle = "#c1acbb";
    pincel.beginPath();
    pincel.moveTo (450, 304);
    pincel.lineTo(675, 104);
    pincel.lineTo(900, 304)
    pincel.fill();
//Triangulo voltado para cima

    //nesse dois casos usei dois .beginPath (triangulos) para formar um losango

</script>

Outra duvida mais simples é se o limite total de uma pagina do navegador seria de 1350x609

(sem imaginar que a pagina segue para baixo com o uso do scroll do mause)