JSFiddle - React, Tailwind, and code Playground

HTML

<svg>
    <clippath id="circle">
      <circle r="120" cx="50%" cy="50%"></circle>
    </clippath>
  
    <g clip-path="url(#circle)">   
   	<foreignObject width="560" x="0"
                y="0" height="315">
        <iframe width="560" height="315" src="//www.youtube.com/embed/QnxLau7m600?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>
    </foreignObject>
   </g>	
</svg>

CSS

svg {
    display: block;
    width: 560px;
    height: 315px;
}