3D transforms
Newly available since 2022-03-14 (baseline low)
The transform CSS property and its 3D transform functions allow rotations and other transforms in three dimensions, including perspective transforms.
Compatibility (view on caniuse.com)
- Chrome 36 Released on 2014-07-16
- Chrome Android 36 Released on 2014-07-16
- Edge 12 Released on 2015-07-29
- Firefox 16 Released on 2012-10-09
- Firefox for Android 16 Released on 2012-10-09
- Safari 15.4 Released on 2022-03-14
- Safari on iOS 15.4 Released on 2022-03-14
MDN docs
- matrix3d() function
- perspective() function
- rotate3d() function
- rotateX() function
- rotateY() function
- rotateZ() function
- scale3d() function
- scaleZ() function
- translate3d() function
- translateZ() function
- perspective property
- perspective-origin property
- transform-style property
- backface-visibility property
Specifications
BCD data
- css.types.transform-function.matrix3d
- css.types.transform-function.perspective
- css.types.transform-function.rotate3d
- css.types.transform-function.rotateX
- css.types.transform-function.rotateY
- css.types.transform-function.rotateZ
- css.types.transform-function.scale3d
- css.types.transform-function.scaleZ
- css.types.transform-function.translate3d
- css.types.transform-function.translateZ
- css.properties.perspective
- css.properties.perspective-origin
- css.properties.perspective-origin.bottom
- css.properties.perspective-origin.center
- css.properties.perspective-origin.left
- css.properties.perspective-origin.right
- css.properties.perspective-origin.top
- css.properties.perspective.none
- css.properties.transform-style
- css.properties.transform.3d
- css.properties.backface-visibility