Z axis point of observation

perspective

Specify the distance from the user's point of observation to the Z axis when performing a transform.

Property values

Specify this property on the container

The distance from the z-plane to the observer's point of reference is specified using one of these units:

em em The font-size of the current font
rem relative em The font-size of the <html> element
in inch A size equal 96px
px pixels A size equal to 1/96 inch
pt point A size equal 1in/72 = 1.33px
pc pica A size equal 1in/6 = 12pt = 16px
cm centimeter A size equal to 96px/2.54 = 37.8px
mm millimeter A size equal to 96px/25.4 = 3.8px
Q quarter millimeter A size equal to 96px/1016 = 0.94px

Smaller values put the observer closer to the object, shortening the vanishing point, giving it less of a 3D effect.

Larger values put the observer farther away from the object, lengthening the vanishing point, giving it more of a 3D effect.

Examples

perspective: 200px;
perspective

style > transform > perspectiveZ axis point of observation

🔎