📪Rotate

.rotate-x-{number}

Applies a 3D rotation around the x-axis to the element.

CSS equivalent: transform: rotateX({number}deg);

Example usage:

<div class="rotate-x-45">This element is rotated 45 degrees around the x-axis.</div>

.rotate-y-{number}

Applies a 3D rotation around the y-axis to the element.

CSS equivalent: transform: rotateY({number}deg);

Example usage:

<div class="rotate-y-90">This element is rotated 90 degrees around the y-axis.</div>

.rotate-z-{number}

Applies a 3D rotation around the z-axis to the element.

CSS equivalent: transform: rotateZ({number}deg);

Example usage:

<div class="rotate-z-180">This element is rotated 180 degrees around the z-axis.</div>

Last updated