JSFiddle - React, Tailwind, and code Playground

by maros_urbanec

HTML

<html>
<body>
    <p>
        Hover over the circles
    </p>
    <svg width="100" height="100">
        <defs>
            <circle id="circle" r="10" class="myCircle">
                <set attributeName="fill" to="red" begin="mouseover" end="mouseout" />
                <animate attributeName="r" begin="mouseover" from="10" to="15" end="mouseout" dur="2s"/>
            </circle>
        </defs>
        <use xlink:href="#circle" transform="translate(30 30)" />
        <use xlink:href="#circle" transform="translate(60 30)" />
    </svg>
</body>
</html>