# Transforms - [Rotate](#rotate) - [Scale](#scale) - [Skew](#skew) - [Transform Origin](#transform-origin) - [Translate](#translate) ----- ## Rotate Utilities for rotating elements with transform. ### Group | TailwindJS token | | ----- | | `rotate_utilities` | ### Utilities | TailwindJS token | TailwindCSS token | | ----- | ----- | | `rotate_0` | [rotate-0](#rotate) | | `rotate_1` | [rotate-1](#rotate) | | `rotate_12` | [rotate-12](#rotate) | | `rotate_180` | [rotate-180](#rotate) | | `rotate_2` | [rotate-2](#rotate) | | `rotate_3` | [rotate-3](#rotate) | | `rotate_45` | [rotate-45](#rotate) | | `rotate_6` | [rotate-6](#rotate) | | `rotate_90` | [rotate-90](#rotate) | ### Arbitraries | TailwindJS token | TailwindCSS token | | ----- | ----- | | `rotate_arbitrary`, `rotate_arb` | [rotate-[…]](#https://tailwindcss.com/docs/rotate#arbitrary-values) | ## Scale Utilities for scaling elements with transform. ### Group | TailwindJS token | | ----- | | `scale_utilities` | ### Utilities | TailwindJS token | TailwindCSS token | | ----- | ----- | | `scale_0` | [scale-0](#scale) | | `scale_100` | [scale-100](#scale) | | `scale_105` | [scale-105](#scale) | | `scale_110` | [scale-110](#scale) | | `scale_125` | [scale-125](#scale) | | `scale_150` | [scale-150](#scale) | | `scale_50` | [scale-50](#scale) | | `scale_75` | [scale-75](#scale) | | `scale_90` | [scale-90](#scale) | | `scale_95` | [scale-95](#scale) | | `scale_x_0` | [scale-x-0](#scale) | | `scale_x_100` | [scale-x-100](#scale) | | `scale_x_105` | [scale-x-105](#scale) | | `scale_x_110` | [scale-x-110](#scale) | | `scale_x_125` | [scale-x-125](#scale) | | `scale_x_150` | [scale-x-150](#scale) | | `scale_x_50` | [scale-x-50](#scale) | | `scale_x_75` | [scale-x-75](#scale) | | `scale_x_90` | [scale-x-90](#scale) | | `scale_x_95` | [scale-x-95](#scale) | | `scale_y_0` | [scale-y-0](#scale) | | `scale_y_100` | [scale-y-100](#scale) | | `scale_y_105` | [scale-y-105](#scale) | | `scale_y_110` | [scale-y-110](#scale) | | `scale_y_125` | [scale-y-125](#scale) | | `scale_y_150` | [scale-y-150](#scale) | | `scale_y_50` | [scale-y-50](#scale) | | `scale_y_75` | [scale-y-75](#scale) | | `scale_y_90` | [scale-y-90](#scale) | | `scale_y_95` | [scale-y-95](#scale) | ### Arbitraries | TailwindJS token | TailwindCSS token | | ----- | ----- | | `scale_arbitrary`, `scale_arb` | [scale-[…]](#https://tailwindcss.com/docs/scale#arbitrary-values) | | `scale_x_arbitrary`, `scale_x_arb` | [scale-x-[…]](#https://tailwindcss.com/docs/scale#arbitrary-values) | | `scale_y_arbitrary`, `scale_y_arb` | [scale-y-[…]](#https://tailwindcss.com/docs/scale#arbitrary-values) | ## Skew Utilities for skewing elements with transform. ### Group | TailwindJS token | | ----- | | `skew_utilities` | ### Utilities | TailwindJS token | TailwindCSS token | | ----- | ----- | | `skew_x_0` | [skew-x-0](#skew) | | `skew_x_1` | [skew-x-1](#skew) | | `skew_x_12` | [skew-x-12](#skew) | | `skew_x_2` | [skew-x-2](#skew) | | `skew_x_3` | [skew-x-3](#skew) | | `skew_x_6` | [skew-x-6](#skew) | | `skew_y_0` | [skew-y-0](#skew) | | `skew_y_1` | [skew-y-1](#skew) | | `skew_y_12` | [skew-y-12](#skew) | | `skew_y_2` | [skew-y-2](#skew) | | `skew_y_3` | [skew-y-3](#skew) | | `skew_y_6` | [skew-y-6](#skew) | ### Arbitraries | TailwindJS token | TailwindCSS token | | ----- | ----- | | `skew_x_arbitrary`, `skew_x_arb` | [skew-x-[…]](#https://tailwindcss.com/docs/skew#arbitrary-values) | | `skew_y_arbitrary`, `skew_y_arb` | [skew-y-[…]](#https://tailwindcss.com/docs/skew#arbitrary-values) | ## Transform Origin Utilities for specifying the origin for an element's transformations. ### Group | TailwindJS token | | ----- | | `transform_origin_utilities` | ### Utilities | TailwindJS token | TailwindCSS token | | ----- | ----- | | `origin_bottom` | [origin-bottom](#transform_origin) | | `origin_bottom_left` | [origin-bottom-left](#transform_origin) | | `origin_bottom_right` | [origin-bottom-right](#transform_origin) | | `origin_center` | [origin-center](#transform_origin) | | `origin_left` | [origin-left](#transform_origin) | | `origin_right` | [origin-right](#transform_origin) | | `origin_top` | [origin-top](#transform_origin) | | `origin_top_left` | [origin-top-left](#transform_origin) | | `origin_top_right` | [origin-top-right](#transform_origin) | ### Arbitraries | TailwindJS token | TailwindCSS token | | ----- | ----- | | `origin_arbitrary`, `origin_arb` | [origin-[…]](#https://tailwindcss.com/docs/transform-origin#arbitrary-values) | | `origin_bottom_arbitrary`, `origin_bottom_arb` | [origin-bottom-[…]](#https://tailwindcss.com/docs/transform-origin#arbitrary-values) | | `origin_top_arbitrary`, `origin_top_arb` | [origin-top-[…]](#https://tailwindcss.com/docs/transform-origin#arbitrary-values) | ## Translate Utilities for translating elements with transform. ### Group | TailwindJS token | | ----- | | `translate_utilities` | ### Utilities | TailwindJS token | TailwindCSS token | | ----- | ----- | | `translate_x_0` | [translate-x-0](#translate) | | `translate_x_0_5` | [translate-x-0.5](#translate) | | `translate_x_1` | [translate-x-1](#translate) | | `translate_x_10` | [translate-x-10](#translate) | | `translate_x_11` | [translate-x-11](#translate) | | `translate_x_12` | [translate-x-12](#translate) | | `translate_x_14` | [translate-x-14](#translate) | | `translate_x_16` | [translate-x-16](#translate) | | `translate_x_1_5` | [translate-x-1.5](#translate) | | `translate_x_1_on_2` | [translate-x-1/2](#translate) | | `translate_x_1_on_3` | [translate-x-1/3](#translate) | | `translate_x_1_on_4` | [translate-x-1/4](#translate) | | `translate_x_2` | [translate-x-2](#translate) | | `translate_x_20` | [translate-x-20](#translate) | | `translate_x_24` | [translate-x-24](#translate) | | `translate_x_28` | [translate-x-28](#translate) | | `translate_x_2_5` | [translate-x-2.5](#translate) | | `translate_x_2_on_3` | [translate-x-2/3](#translate) | | `translate_x_2_on_4` | [translate-x-2/4](#translate) | | `translate_x_3` | [translate-x-3](#translate) | | `translate_x_32` | [translate-x-32](#translate) | | `translate_x_36` | [translate-x-36](#translate) | | `translate_x_3_5` | [translate-x-3.5](#translate) | | `translate_x_3_on_4` | [translate-x-3/4](#translate) | | `translate_x_4` | [translate-x-4](#translate) | | `translate_x_40` | [translate-x-40](#translate) | | `translate_x_44` | [translate-x-44](#translate) | | `translate_x_48` | [translate-x-48](#translate) | | `translate_x_5` | [translate-x-5](#translate) | | `translate_x_52` | [translate-x-52](#translate) | | `translate_x_56` | [translate-x-56](#translate) | | `translate_x_6` | [translate-x-6](#translate) | | `translate_x_60` | [translate-x-60](#translate) | | `translate_x_64` | [translate-x-64](#translate) | | `translate_x_7` | [translate-x-7](#translate) | | `translate_x_72` | [translate-x-72](#translate) | | `translate_x_8` | [translate-x-8](#translate) | | `translate_x_80` | [translate-x-80](#translate) | | `translate_x_9` | [translate-x-9](#translate) | | `translate_x_96` | [translate-x-96](#translate) | | `translate_x_full` | [translate-x-full](#translate) | | `translate_x_px` | [translate-x-px](#translate) | | `translate_y_0` | [translate-y-0](#translate) | | `translate_y_0_5` | [translate-y-0.5](#translate) | | `translate_y_1` | [translate-y-1](#translate) | | `translate_y_10` | [translate-y-10](#translate) | | `translate_y_11` | [translate-y-11](#translate) | | `translate_y_12` | [translate-y-12](#translate) | | `translate_y_14` | [translate-y-14](#translate) | | `translate_y_16` | [translate-y-16](#translate) | | `translate_y_1_5` | [translate-y-1.5](#translate) | | `translate_y_1_on_2` | [translate-y-1/2](#translate) | | `translate_y_1_on_3` | [translate-y-1/3](#translate) | | `translate_y_1_on_4` | [translate-y-1/4](#translate) | | `translate_y_2` | [translate-y-2](#translate) | | `translate_y_20` | [translate-y-20](#translate) | | `translate_y_24` | [translate-y-24](#translate) | | `translate_y_28` | [translate-y-28](#translate) | | `translate_y_2_5` | [translate-y-2.5](#translate) | | `translate_y_2_on_3` | [translate-y-2/3](#translate) | | `translate_y_2_on_4` | [translate-y-2/4](#translate) | | `translate_y_3` | [translate-y-3](#translate) | | `translate_y_32` | [translate-y-32](#translate) | | `translate_y_36` | [translate-y-36](#translate) | | `translate_y_3_5` | [translate-y-3.5](#translate) | | `translate_y_3_on_4` | [translate-y-3/4](#translate) | | `translate_y_4` | [translate-y-4](#translate) | | `translate_y_40` | [translate-y-40](#translate) | | `translate_y_44` | [translate-y-44](#translate) | | `translate_y_48` | [translate-y-48](#translate) | | `translate_y_5` | [translate-y-5](#translate) | | `translate_y_52` | [translate-y-52](#translate) | | `translate_y_56` | [translate-y-56](#translate) | | `translate_y_6` | [translate-y-6](#translate) | | `translate_y_60` | [translate-y-60](#translate) | | `translate_y_64` | [translate-y-64](#translate) | | `translate_y_7` | [translate-y-7](#translate) | | `translate_y_72` | [translate-y-72](#translate) | | `translate_y_8` | [translate-y-8](#translate) | | `translate_y_80` | [translate-y-80](#translate) | | `translate_y_9` | [translate-y-9](#translate) | | `translate_y_96` | [translate-y-96](#translate) | | `translate_y_full` | [translate-y-full](#translate) | | `translate_y_px` | [translate-y-px](#translate) | ### Arbitraries | TailwindJS token | TailwindCSS token | | ----- | ----- | | `translate_x_arbitrary`, `translate_x_arb` | [translate-x-[…]](#https://tailwindcss.com/docs/translate#arbitrary-values) | | `translate_y_arbitrary`, `translate_y_arb` | [translate-y-[…]](#https://tailwindcss.com/docs/translate#arbitrary-values) |