CSS rotateZ() Function

Example

.example {
  transform: rotateZ(45deg);
}

Hello World!

Meaning

The rotateZ() css function defines a transformation that rotates an element around the z-axis without deforming it.

Note: rotateZ(angle) is equivalent to rotate(angle) or rotate3d(0, 0, 1, angle).

The axis of rotation passes through an origin, defined by the transform-origin CSS property.

Note: Unlike rotations in the 2D plane, the composition of 3D rotations is usually not commutative. In other words, the order in which the rotations are applied impacts the result.

Version: CSS3

Standard Syntax

rotateZ(angle)

The value of rotation created by rotateZ() is specified by an angle.

If positive, the movement will be clockwise; if negative, it will be counter-clockwise.

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Status

Function Arguments

The following table describes the arguments of this function.

Argument	Description
angle	Defines the rotation of the element. A positive, the movement will be clockwise; if negative, it will be counter-clockwise.