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

rendered animation

Only CSS: Creamy Star

1<div id="ui"><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div><div class="ball"><div class="ball_inner"></div></div></div>