perspective-origin
Sets the 'vanishing point' for a 3D transformation. It determines the position from which the viewer is looking at the 3D space.
Quick example
.scene {
/* Sets the scene to feel like we are looking from the top-left */
perspective: 1000px;
perspective-origin: top left;
}Quick facts
Initial value
50% 50%Inherited
No
Applies to
transformable elements
Animation type
simpleListOfLpc
perspective-origin Browser Support
Widely available Since 2022 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2022.
Safe to use without fallbacks.
36+
16+
9+
12+