JSFiddle - React, Tailwind, and code Playground

HTML

<style>
  .button div {
    width: 38px;
    height: 38px;
    top: 109px;
    left: 111px;
    background-color: black;
    background-size: 14px 18px;
    background-repeat: no-repeat;
    border-radius: 50%;
    box-Shadow: inset 0 0 0 2px lime;
    position: absolute;
  }
  
  image {
    transform: translate(40px, 40px);
  }

</style>

<div id="playButton2" style="position:relative;border: 3px solid #0059dd;background-color:black;width: 260px; height: 260px;cursor: pointer;" onclick=" 
var button = document.getElementById('playButton2');
var player = document.getElementById('player2');
button.querySelector('.play').style.display='none';
button.querySelector('.pause').style.display='none';
player.volume=1.0; if (player.paused) {
button.querySelector('.pause').style.display='inline-block';
player.play();
} else {
button.querySelector('.play').style.display='inline-block';
player.pause();
}">

  <svg width="260" height="260" style="position: absolute; ">

    <defs>
      <clipPath id="circleView">
        <circle cx="90" cy="90" r="85" fill="orange" />
      </clipPath>
    </defs>

    <image width="180" height="180" xlink:href="https://i.imgur.com/uuqDlZB.jpg" clip-path="url(#circleView)" />

    <image width="180" height="180" xlink:href="http://i.imgur.com/4HJbzEq.png" />

    <svg width="260" height="260">
      <defs>
        <linearGradient id="MyGradient">
          <stop offset="0%" stop-color="transparent" />
          <stop offset="33%" stop-color="transparent" />
          <stop offset="33%" stop-color="#0059dd" />
          <stop offset="34.2%" stop-color="#0059dd" />
          <stop offset="34.2%" stop-color="transparent" />
          <stop offset="68%" stop-color="transparent" />
          <stop offset="68%" stop-color="#0059dd" />
          <stop offset="69.2%" stop-color="#0059dd" />
          <stop offset="69.2%" stop-color="transparent" />
          <stop offset="102%" stop-color="transparent" />
        </linearGradient>
      </defs>

    ...