animation2code benchmark
For best compatibility, please view this dashboard in a Chrome browser.
← back

rendered animation

Leap Frog Loader

1<svg id="mainSVG" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000">
2    <g id="whole">
3      <g id="dotGroup" fill="#F9EBE0">
4        <circle id="endDot" cx="100" cy="500" r="25"  opacity="0"/>
5        <circle cx="300" cy="500" r="25"/>
6        <circle cx="500" cy="500" r="25"/>
7        <circle id="startDot" cx="700" cy="500" r="25"/>
8      </g>
9      <path id="connector" d="M700,500c0-165.69-134.31-300-300-300S100,334.31,100,500" fill="none" stroke="#F9EBE0" stroke-linecap="round" stroke-linejoin="round" stroke-width="50"/>	
10    </g>
11</svg>
12