JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
<html>
  <head>
    <style>
      .outer {
          overflow: hidden;
          width: 300px;
          height: 300px;
          border-radius: 50%
      }
      .inner {
          transform: scale(1);
          background: blue;
          height: 100%
      }
    </style>
  </head>
  <body>
    <div class="outer">
      <div class="inner">
        <div style="transform: translateZ(1px);"></div>
      </div>
    </div>
  </body>
</html>