Skip to content

Instantly share code, notes, and snippets.

@alvinwan
Created February 21, 2019 18:19
Show Gist options
  • Save alvinwan/bb6dd2a32176c57bc1b23b00df09df6a to your computer and use it in GitHub Desktop.
Save alvinwan/bb6dd2a32176c57bc1b23b00df09df6a to your computer and use it in GitHub Desktop.
The noob's guide to 3D Transforms with CSS - Cube Example, Style 5
.front { transform: rotateY(0deg) translateZ(5em); }
.right { transform: rotateY(90deg) translateZ(5em); }
.left { transform: rotateY(-90deg) translateZ(5em); }
.back { transform: rotateY(180deg) translateZ(5em); }
.top { transform: rotateX(90deg) translateZ(5em); }
.bottom { transform: rotateX(-90deg) translateZ(5em); }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment