JSFiddle - React, Tailwind, and code Playground

by Fred Fourie

HTML

<svg width="100" height="100">
	<circle cx="50" cy="50" r="45" stroke="black" stroke-width="1" fill="white" />	
    <circle cx="50" cy="50" r="50" stroke="black" stroke-width="1" fill="none"/>	
	
	
    <polygon points="50,10 53,20 53,85 47,85 47,20 50,10" fill="#4D4D4D" transform="rotate(180,50,50)" id="point">
        </polygon>
  
    
    <polygon points="50,15 65,20 65,85 35,85 35,20 50,15" fill="#FFFF33" opacity="0.9" style="stroke:black" transform="rotate(270,50,50)">
	</polygon>
    
</svg>