JSFiddle - React, Tailwind, and code Playground

HTML

<html>
        <head>
        <title>Canvas tutorial</title>
        <script type="text/javascript"> 
            function init(){
                ctx = document.getElementById('canvas').getContext('2d');
                ctx.fillStyle = "#c82124"; //red
                ctx.beginPath();
                ctx.arc(15,15,15,0,Math.PI*2,true);
                ctx.closePath();
                ctx.fill();

                ctx.fillStyle = "#3370d4"; //blue
                ctx.beginPath();
                ctx.arc(100,15,15,0,Math.PI*2,true);
                ctx.closePath();
                ctx.fill();
            }
        </script>
        </head>

        <body onload="init();" bgcolor="white">
                <canvas name="canvas" id="canvas" width="1000" height="1000"></canvas>
        </body>
</html>