JSFiddle - React, Tailwind, and code Playground

by slawe

HTML

<svg width="400px" height="400px" viewBox="0 0 800 800"
     version="1.1" xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink">
  <g transform="translate(400, 400)">
    <circle cx="0" cy="0" r="40" style="fill:white;stroke:black; stroke-width:30; stroke-dasharray:18, 18;">
      <animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0" to="360" begin="0" dur="5s" repeatCount="indefinite" />
    </circle>
    <line x1="-20" y1="0" x2="20" y2="0" style="stroke: black;" />
    <line x1="0" y1="-20" x2="0" y2="20" style="stroke: black;" />
  </g>
</svg>