CSS : 3d

3D CSS - lighting, animations, and more!

https://css-tricks.com/how-css-perspective-works/

 

3D Animated Product Card Using Only HTML & CSS

 

 

https://3dtransforms.desandro.com/perspective

transform: perspective(400px);

 

.panel--red {

  /* perspective function in transform property */

  transform: perspective(400px) rotateY(45deg);

}

.scene--blue {

  /* perspective property */

  perspective: 400px;

}

 

.panel--blue {

  transform: rotateY(45deg);

}

https://3dtransforms.desandro.com/3d-transform-functions

 

https://www.smashingmagazine.com/2012/04/beercamp-experiment-with-css3d/

 

 

 

https://www.smashingmagazine.com/2012/01/adventures-in-the-third-dimension-css-3-d-transforms/

 

https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translateZ