> For the complete documentation index, see [llms.txt](https://codennerd.gitbook.io/cxcss/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://codennerd.gitbook.io/cxcss/product-guides/transform/rotate.md).

# Rotate

## `.rotate-x-{number}`

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

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

Example usage:

```html
<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:

```html
<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:

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