JSFiddle - React, Tailwind, and code Playground

HTML

<svg>
  <g transform='translate(100,100)'>
    <circle id='circleSVG' r='15'></circle>
  </g>
</svg>

CSS

#circleSVG {
  fill: red;
  stroke: green;
}

#circleSVG:hover {
  fill: orange;
   opacity:0.25;
}