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

rendered animation

Only CSS: Jungle Gym

1<div id="box_world"><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div><div class="box_wrapper"><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div><div class="box_wall"></div></div></div>