JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <canvas id="myCanvas" width="200px" height="200px"></canvas>
    <script>
      
    </script>
  </body>

CSS

canvas#myCanvas {
		  
		  border: 1px solid;
	  }

JavaScript

var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');
      var centerX = canvas.width / 2;
      var centerY = canvas.height / 2;
      var radius = 50;

      context.beginPath();
      context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
      context.fillStyle = 'white';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'black';
      context.stroke();