📪Rotate
.rotate-x-{number}
.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}
.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}
.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