spinny

dabblet.css

/* spinny */
section { width:1em; height:1em; margin:auto; 
  border:1px solid black; background:hsla(137,100%,30%,.3);
  transform-origin:50%; transform-style:preserve-3d }

  @keyframes spin { 50% { transform:rotate3d(1,1,1,579.6deg) } }
  #a { animation:spin 8s infinite }
  #b { animation:spin 5s infinite }
  #c { animation:spin 3s infinite }

body { font:26em/1 monospace; perspective:5em }

dabblet.html

<section id=a>
  <section id=b>
    <section id=c></section>
  </section>
</section>

settings.json

{"view":"split","fontsize":"140","seethrough":"1","prefixfree":"1","page":"all"}