JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="example" width=400 height=400>
</canvas>

JavaScript

function drawDick (canvas) {
    if (canvas.getContext) {
        var ctx = canvas.getContext("2d");
        var parrotX = canvas.width/6;
        var parrotY = canvas.height/6;
        ctx.beginPath();
            ctx.moveTo(parrotX*4, parrotY);
            ctx.lineTo(parrotX*2, parrotY*3);
            ctx.moveTo(parrotX*3, parrotY*4);
            ctx.lineTo(parrotX*5, parrotY*2);
            ctx.moveTo(parrotX*4, parrotY);
            ctx.bezierCurveTo(
                parrotX*5, 0,
                parrotX*6, parrotY,
                parrotX*5, parrotY*2);
            ctx.moveTo(parrotX*5+parrotX/4, parrotY-parrotY/4);
            ctx.lineTo(parrotX*5, parrotY);
            ctx.moveTo(parrotX*4, parrotY);
            ctx.lineTo(parrotX*5, parrotY*2);
            ctx.moveTo(parrotX*2, parrotY*3);
            ctx.bezierCurveTo(
                parrotX+parrotX/3, parrotY*2+parrotY/3,
                0+parrotX/3, parrotY*3+parrotY/3,
                parrotX, parrotY*4);
            ctx.moveTo(parrotX*3, parrotY*4);
            ctx.bezierCurveTo(
                parrotX*4-parrotX/3, parrotY*5-parrotY/3,
                parrotX*3-parrotX/3, parrotY*6-parrotY/3,
                parrotX*2, parrotY*5);
            ctx.moveTo(parrotX*2-parrotX/6, parrotY*4+parrotY/6);
            ctx.quadraticCurveTo(
                parrotX+parrotX/3, parrotY*4+parrotY/3,
                parrotX, parrotY*4);
            ctx.moveTo(parrotX*2-parrotX/6, parrotY*4+parrotY/6);
            ctx.quadraticCurveTo(
                parrotX*2-parrotX/3, parrotY*5-parrotY/3,
                parrotX*2, parrotY*5);
            ctx.stroke();
        ctx.closePath();
    }
}

drawDick(document.getElementById("example"));