JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
  <head>
    <style>
      body,
      div {
        padding: 20px;
        margin: 0px;
      }
      div {
        width: 300px;
        height: 300px;
        border: 1px solid;
        float: left;
      }
    </style>
  </head>

  <body>
    <canvas
      id="myCanvas"
      style="
        border: none;
        padding-left: 0;
        padding-right: 0;
        margin-left: auto;
        margin-right: auto;
        display: block;
        width: 100%;
      "
      width="500"
      height="100"
    >
      Your browser does not support HTML5
    </canvas>
    <script type="text/javascript">
      var c = document.getElementById("myCanvas");
      var ctx = c.getContext("2d");
      ctx.font = "31.5px Montserrat,sans-serif";
      ctx.textBaseline = "alphabetic";
      ctx.fillText("W", 190, 70);
    </script>
  </body>
</html>