perspective: momentum-space

dabblet.css

/* perspective: momentum-space */
* { transition:all 24.9ms linear }
body { perspective:.6em; font-size:400px;
  background:#000 }
 
@keyframes spin {
  38.1% { transform:rotateX();
    border-radius:2.618em  }}
  
  section { background:hsla(222.45,61.8%,38.1%,.3);
  margin:20% auto; transform:rotateY(45deg);
  width:1em; height:1em;
  transform-origin:50%;
  animation:spin 25.9ms infinite alternate  }
  
/* todo:
http://css-tricks.com/snippets/css/webkit-keyframe-animation-syntax/
http://desandro.github.com/3dtransforms/docs/perspective.html
*/

dabblet.html

<section></section>

settings.json

{"view":"separate","seethrough":"1","prefixfree":"1","page":"all"}