Coração Pulsante!

Eu não faço ideia de como poderia ter feito um coração, mas acho que dá pro gasto haha.

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

<script>

    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2d');
    pincel.fillStyle = 'lightgray';
    pincel.fillRect(0, 0, 600, 400);
    var raio = 20; // máximo de 50
    var sentido = 1;

    function resetaTela() { // desenha um novo canvas em cima do anterior, para apagar a bolinha feita anteriormente.

        pincel.fillStyle = "lightgray";
        pincel.fillRect(0,0,600,400);

    }     

    function desenhaCoração(x, y, raio) { // desenha um círculo, que receberá suas dimensões mais tarde.

        pincel.fillStyle = 'red';
        pincel.beginPath();
        pincel.arc(x-20, y, raio, 0, 2 * Math.PI);
        pincel.fill();

        pincel.fillStyle = 'red';
        pincel.beginPath();
        pincel.arc(x+20, y, raio, 0, 2 * Math.PI);
        pincel.fill();

        pincel.fillStyle = "red";
        pincel.beginPath();
        pincel.arc(x,y+30,raio,1.5,2 * Math.PI);
        pincel.fill();

        pincel.fillStyle = "lightgray";
        pincel.beginPath();
        pincel.arc(x,y+30.5,raio,1.5,1 * Math.PI);
        pincel.fill();

    }

    function coraçãoPulsante() { // chama as duas funções anteriores: criando um novo coração, incrementando a variável raio, para que a o próximo coração seja desenhado em cima e criando um “novo canvas” em cima do anterior, apagando, assim o coração feito anteriormente. 


        resetaTela();

        if (raio > 50) { // testa se o coração chegou ao tamanho máximo. Caso tenha chegado, altera o valor de "sentido", para fazê-lo retrair.

            sentido = -1;

        } else if (raio < 20) { // testa se o coração chegou ao tamanho mínimo. Caso tenha chegado, altera o valor de "sentido", para fazê-lo expandir.

            sentido = 1

        }


        desenhaCoração(300,200,raio);

        raio = raio + sentido; // incrementa e decrementa o valor do raio, dando a alusão da pulsação.
    }


    setInterval(coraçãoPulsante,15); // define que a função "coraçãoPulsante" será chamada a cada x milissegundos, e é somente assim que a ilusão de pulsação é reproduzida.

</script>