Transforms
translate to Tailwind
Uses the spacing scale and fractions, with negative values written as-translate-x-4.The 371 mappings below are read straight out of Tailwind v4.3.3, not maintained by hand, so this is what the converter will actually produce for translate.
translate values and their classes
| CSS | Tailwind |
|---|---|
| translate: -100% -100%; | -translate-full |
| translate: -100% 0; | -translate-x-full |
| translate: -91.666667% -91.666667%; | -translate-11/12 |
| translate: -91.666667% 0; | -translate-x-11/12 |
| translate: -83.333333% -83.333333%; | -translate-5/6 |
| translate: -83.333333% 0; | -translate-x-5/6 |
| translate: -80% -80%; | -translate-4/5 |
| translate: -80% 0; | -translate-x-4/5 |
| translate: -75% -75%; | -translate-3/4 |
| translate: -75% 0; | -translate-x-3/4 |
| translate: -66.666667% -66.666667%; | -translate-2/3 |
| translate: -66.666667% 0; | -translate-x-2/3 |
| translate: -60% -60%; | -translate-3/5 |
| translate: -60% 0; | -translate-x-3/5 |
| translate: -58.333333% -58.333333%; | -translate-7/12 |
| translate: -58.333333% 0; | -translate-x-7/12 |
| translate: -50% -50%; | -translate-1/2 |
| translate: -50% 0; | -translate-x-1/2 |
| translate: -41.666667% -41.666667%; | -translate-5/12 |
| translate: -41.666667% 0; | -translate-x-5/12 |
| translate: -40% -40%; | -translate-2/5 |
| translate: -40% 0; | -translate-x-2/5 |
| translate: -33.333333% -33.333333%; | -translate-1/3 |
| translate: -33.333333% 0; | -translate-x-1/3 |
| translate: -25% -25%; | -translate-1/4 |
| translate: -25% 0; | -translate-x-1/4 |
| translate: -24rem -24rem; | -translate-96 |
| translate: -24rem 0; | -translate-x-96 |
| translate: -20% -20%; | -translate-1/5 |
| translate: -20% 0; | -translate-x-1/5 |
| translate: -20rem -20rem; | -translate-80 |
| translate: -20rem 0; | -translate-x-80 |
| translate: -18rem -18rem; | -translate-72 |
| translate: -18rem 0; | -translate-x-72 |
| translate: -16.666667% -16.666667%; | -translate-1/6 |
| translate: -16.666667% 0; | -translate-x-1/6 |
| translate: -16rem -16rem; | -translate-64 |
| translate: -16rem 0; | -translate-x-64 |
| translate: -15rem -15rem; | -translate-60 |
| translate: -15rem 0; | -translate-x-60 |
| translate: -14rem -14rem; | -translate-56 |
| translate: -14rem 0; | -translate-x-56 |
| translate: -13rem -13rem; | -translate-52 |
| translate: -13rem 0; | -translate-x-52 |
| translate: -12rem -12rem; | -translate-48 |
| translate: -12rem 0; | -translate-x-48 |
| translate: -11rem -11rem; | -translate-44 |
| translate: -11rem 0; | -translate-x-44 |
| translate: -10rem -10rem; | -translate-40 |
| translate: -10rem 0; | -translate-x-40 |
| translate: -9rem -9rem; | -translate-36 |
| translate: -9rem 0; | -translate-x-36 |
| translate: -8.333333% -8.333333%; | -translate-1/12 |
| translate: -8.333333% 0; | -translate-x-1/12 |
| translate: -8rem -8rem; | -translate-32 |
| translate: -8rem 0; | -translate-x-32 |
| translate: -7rem -7rem; | -translate-28 |
| translate: -7rem 0; | -translate-x-28 |
| translate: -6rem -6rem; | -translate-24 |
| translate: -6rem 0; | -translate-x-24 |
| translate: -5rem -5rem; | -translate-20 |
| translate: -5rem 0; | -translate-x-20 |
| translate: -4rem -4rem; | -translate-16 |
| translate: -4rem 0; | -translate-x-16 |
| translate: -3.5rem -3.5rem; | -translate-14 |
| translate: -3.5rem 0; | -translate-x-14 |
| translate: -3rem -3rem; | -translate-12 |
| translate: -3rem 0; | -translate-x-12 |
| translate: -2.75rem -2.75rem; | -translate-11 |
| translate: -2.75rem 0; | -translate-x-11 |
| translate: -2.5rem -2.5rem; | -translate-10 |
| translate: -2.5rem 0; | -translate-x-10 |
| translate: -2.25rem -2.25rem; | -translate-9 |
| translate: -2.25rem 0; | -translate-x-9 |
| translate: -2rem -2rem; | -translate-8 |
| translate: -2rem 0; | -translate-x-8 |
| translate: -1.75rem -1.75rem; | -translate-7 |
| translate: -1.75rem 0; | -translate-x-7 |
| translate: -1.5rem -1.5rem; | -translate-6 |
| translate: -1.5rem 0; | -translate-x-6 |
| translate: -1.25rem -1.25rem; | -translate-5 |
| translate: -1.25rem 0; | -translate-x-5 |
| translate: -1px -1px; | -translate-px |
| translate: -1px 0; | -translate-x-px |
| translate: -1rem -1rem; | -translate-4 |
| translate: -1rem 0; | -translate-x-4 |
| translate: -0.875rem -0.875rem; | -translate-3.5 |
| translate: -0.875rem 0; | -translate-x-3.5 |
| translate: -0.75rem -0.75rem; | -translate-3 |
| translate: -0.75rem 0; | -translate-x-3 |
| translate: -0.625rem -0.625rem; | -translate-2.5 |
| translate: -0.625rem 0; | -translate-x-2.5 |
| translate: -0.5rem -0.5rem; | -translate-2 |
| translate: -0.5rem 0; | -translate-x-2 |
| translate: -0.375rem -0.375rem; | -translate-1.5 |
| translate: -0.375rem 0; | -translate-x-1.5 |
| translate: -0.25rem -0.25rem; | -translate-1 |
| translate: -0.25rem 0; | -translate-x-1 |
| translate: -0.125rem -0.125rem; | -translate-0.5 |
| translate: -0.125rem 0; | -translate-x-0.5 |
| translate: 0 -0.125rem; | -translate-y-0.5 |
| translate: 0 -0.25rem; | -translate-y-1 |
| translate: 0 -0.375rem; | -translate-y-1.5 |
| translate: 0 -0.5rem; | -translate-y-2 |
| translate: 0 -0.625rem; | -translate-y-2.5 |
| translate: 0 -0.75rem; | -translate-y-3 |
| translate: 0 -0.875rem; | -translate-y-3.5 |
| translate: 0 -1.25rem; | -translate-y-5 |
| translate: 0 -1.5rem; | -translate-y-6 |
| translate: 0 -1.75rem; | -translate-y-7 |
| translate: 0 -100%; | -translate-y-full |
| translate: 0 -10rem; | -translate-y-40 |
| translate: 0 -11rem; | -translate-y-44 |
| translate: 0 -12rem; | -translate-y-48 |
| translate: 0 -13rem; | -translate-y-52 |
| translate: 0 -14rem; | -translate-y-56 |
| translate: 0 -15rem; | -translate-y-60 |
| translate: 0 -16.666667%; | -translate-y-1/6 |
| translate: 0 -16rem; | -translate-y-64 |
| translate: 0 -18rem; | -translate-y-72 |
| translate: 0 -1px; | -translate-y-px |
| translate: 0 -1rem; | -translate-y-4 |
| translate: 0 -2.25rem; | -translate-y-9 |
| translate: 0 -2.5rem; | -translate-y-10 |
| translate: 0 -2.75rem; | -translate-y-11 |
| translate: 0 -20%; | -translate-y-1/5 |
| translate: 0 -20rem; | -translate-y-80 |
| translate: 0 -24rem; | -translate-y-96 |
| translate: 0 -25%; | -translate-y-1/4 |
| translate: 0 -2rem; | -translate-y-8 |
| translate: 0 -3.5rem; | -translate-y-14 |
| translate: 0 -33.333333%; | -translate-y-1/3 |
| translate: 0 -3rem; | -translate-y-12 |
| translate: 0 -40%; | -translate-y-2/5 |
| translate: 0 -41.666667%; | -translate-y-5/12 |
| translate: 0 -4rem; | -translate-y-16 |
| translate: 0 -50%; | -translate-y-1/2 |
| translate: 0 -58.333333%; | -translate-y-7/12 |
| translate: 0 -5rem; | -translate-y-20 |
| translate: 0 -60%; | -translate-y-3/5 |
| translate: 0 -66.666667%; | -translate-y-2/3 |
| translate: 0 -6rem; | -translate-y-24 |
| translate: 0 -75%; | -translate-y-3/4 |
| translate: 0 -7rem; | -translate-y-28 |
| translate: 0 -8.333333%; | -translate-y-1/12 |
| translate: 0 -80%; | -translate-y-4/5 |
| translate: 0 -83.333333%; | -translate-y-5/6 |
| translate: 0 -8rem; | -translate-y-32 |
| translate: 0 -91.666667%; | -translate-y-11/12 |
| translate: 0 -9rem; | -translate-y-36 |
| translate: 0 0; | translate-0 |
| translate: 0 0 -0.125rem; | -translate-z-0.5 |
| translate: 0 0 -0.25rem; | -translate-z-1 |
| translate: 0 0 -0.375rem; | -translate-z-1.5 |
| translate: 0 0 -0.5rem; | -translate-z-2 |
| translate: 0 0 -0.625rem; | -translate-z-2.5 |
| translate: 0 0 -0.75rem; | -translate-z-3 |
| translate: 0 0 -0.875rem; | -translate-z-3.5 |
| translate: 0 0 -1.25rem; | -translate-z-5 |
| translate: 0 0 -1.5rem; | -translate-z-6 |
| translate: 0 0 -1.75rem; | -translate-z-7 |
| translate: 0 0 -10rem; | -translate-z-40 |
| translate: 0 0 -11rem; | -translate-z-44 |
| translate: 0 0 -12rem; | -translate-z-48 |
| translate: 0 0 -13rem; | -translate-z-52 |
| translate: 0 0 -14rem; | -translate-z-56 |
| translate: 0 0 -15rem; | -translate-z-60 |
| translate: 0 0 -16rem; | -translate-z-64 |
| translate: 0 0 -18rem; | -translate-z-72 |
| translate: 0 0 -1px; | -translate-z-px |
| translate: 0 0 -1rem; | -translate-z-4 |
| translate: 0 0 -2.25rem; | -translate-z-9 |
| translate: 0 0 -2.5rem; | -translate-z-10 |
| translate: 0 0 -2.75rem; | -translate-z-11 |
| translate: 0 0 -20rem; | -translate-z-80 |
| translate: 0 0 -24rem; | -translate-z-96 |
| translate: 0 0 -2rem; | -translate-z-8 |
| translate: 0 0 -3.5rem; | -translate-z-14 |
| translate: 0 0 -3rem; | -translate-z-12 |
| translate: 0 0 -4rem; | -translate-z-16 |
| translate: 0 0 -5rem; | -translate-z-20 |
| translate: 0 0 -6rem; | -translate-z-24 |
| translate: 0 0 -7rem; | -translate-z-28 |
| translate: 0 0 -8rem; | -translate-z-32 |
| translate: 0 0 -9rem; | -translate-z-36 |
| translate: 0 0 0; | translate-3d |
| translate: 0 0 0.125rem; | translate-z-0.5 |
| translate: 0 0 0.25rem; | translate-z-1 |
| translate: 0 0 0.375rem; | translate-z-1.5 |
| translate: 0 0 0.5rem; | translate-z-2 |
| translate: 0 0 0.625rem; | translate-z-2.5 |
| translate: 0 0 0.75rem; | translate-z-3 |
| translate: 0 0 0.875rem; | translate-z-3.5 |
| translate: 0 0 1.25rem; | translate-z-5 |
| translate: 0 0 1.5rem; | translate-z-6 |
| translate: 0 0 1.75rem; | translate-z-7 |
| translate: 0 0 10rem; | translate-z-40 |
| translate: 0 0 11rem; | translate-z-44 |
| translate: 0 0 12rem; | translate-z-48 |
| translate: 0 0 13rem; | translate-z-52 |
| translate: 0 0 14rem; | translate-z-56 |
| translate: 0 0 15rem; | translate-z-60 |
| translate: 0 0 16rem; | translate-z-64 |
| translate: 0 0 18rem; | translate-z-72 |
| translate: 0 0 1px; | translate-z-px |
| translate: 0 0 1rem; | translate-z-4 |
| translate: 0 0 2.25rem; | translate-z-9 |
| translate: 0 0 2.5rem; | translate-z-10 |
| translate: 0 0 2.75rem; | translate-z-11 |
| translate: 0 0 20rem; | translate-z-80 |
| translate: 0 0 24rem; | translate-z-96 |
| translate: 0 0 2rem; | translate-z-8 |
| translate: 0 0 3.5rem; | translate-z-14 |
| translate: 0 0 3rem; | translate-z-12 |
| translate: 0 0 4rem; | translate-z-16 |
| translate: 0 0 5rem; | translate-z-20 |
| translate: 0 0 6rem; | translate-z-24 |
| translate: 0 0 7rem; | translate-z-28 |
| translate: 0 0 8rem; | translate-z-32 |
| translate: 0 0 9rem; | translate-z-36 |
| translate: 0 0.125rem; | translate-y-0.5 |
| translate: 0 0.25rem; | translate-y-1 |
| translate: 0 0.375rem; | translate-y-1.5 |
| translate: 0 0.5rem; | translate-y-2 |
| translate: 0 0.625rem; | translate-y-2.5 |
| translate: 0 0.75rem; | translate-y-3 |
| translate: 0 0.875rem; | translate-y-3.5 |
| translate: 0 1.25rem; | translate-y-5 |
| translate: 0 1.5rem; | translate-y-6 |
| translate: 0 1.75rem; | translate-y-7 |
| translate: 0 100%; | translate-y-full |
| translate: 0 10rem; | translate-y-40 |
| translate: 0 11rem; | translate-y-44 |
| translate: 0 12rem; | translate-y-48 |
| translate: 0 13rem; | translate-y-52 |
| translate: 0 14rem; | translate-y-56 |
| translate: 0 15rem; | translate-y-60 |
| translate: 0 16.666667%; | translate-y-1/6 |
| translate: 0 16rem; | translate-y-64 |
| translate: 0 18rem; | translate-y-72 |
| translate: 0 1px; | translate-y-px |
| translate: 0 1rem; | translate-y-4 |
| translate: 0 2.25rem; | translate-y-9 |
| translate: 0 2.5rem; | translate-y-10 |
| translate: 0 2.75rem; | translate-y-11 |
| translate: 0 20%; | translate-y-1/5 |
| translate: 0 20rem; | translate-y-80 |
| translate: 0 24rem; | translate-y-96 |
| translate: 0 25%; | translate-y-1/4 |
| translate: 0 2rem; | translate-y-8 |
| translate: 0 3.5rem; | translate-y-14 |
| translate: 0 33.333333%; | translate-y-1/3 |
| translate: 0 3rem; | translate-y-12 |
| translate: 0 40%; | translate-y-2/5 |
| translate: 0 41.666667%; | translate-y-5/12 |
| translate: 0 4rem; | translate-y-16 |
| translate: 0 50%; | translate-y-1/2 |
| translate: 0 58.333333%; | translate-y-7/12 |
| translate: 0 5rem; | translate-y-20 |
| translate: 0 60%; | translate-y-3/5 |
| translate: 0 66.666667%; | translate-y-2/3 |
| translate: 0 6rem; | translate-y-24 |
| translate: 0 75%; | translate-y-3/4 |
| translate: 0 7rem; | translate-y-28 |
| translate: 0 8.333333%; | translate-y-1/12 |
| translate: 0 80%; | translate-y-4/5 |
| translate: 0 83.333333%; | translate-y-5/6 |
| translate: 0 8rem; | translate-y-32 |
| translate: 0 91.666667%; | translate-y-11/12 |
| translate: 0 9rem; | translate-y-36 |
| translate: 0.125rem 0; | translate-x-0.5 |
| translate: 0.125rem 0.125rem; | translate-0.5 |
| translate: 0.25rem 0; | translate-x-1 |
| translate: 0.25rem 0.25rem; | translate-1 |
| translate: 0.375rem 0; | translate-x-1.5 |
| translate: 0.375rem 0.375rem; | translate-1.5 |
| translate: 0.5rem 0; | translate-x-2 |
| translate: 0.5rem 0.5rem; | translate-2 |
| translate: 0.625rem 0; | translate-x-2.5 |
| translate: 0.625rem 0.625rem; | translate-2.5 |
| translate: 0.75rem 0; | translate-x-3 |
| translate: 0.75rem 0.75rem; | translate-3 |
| translate: 0.875rem 0; | translate-x-3.5 |
| translate: 0.875rem 0.875rem; | translate-3.5 |
| translate: 1px 0; | translate-x-px |
| translate: 1px 1px; | translate-px |
| translate: 1rem 0; | translate-x-4 |
| translate: 1rem 1rem; | translate-4 |
| translate: 1.25rem 0; | translate-x-5 |
| translate: 1.25rem 1.25rem; | translate-5 |
| translate: 1.5rem 0; | translate-x-6 |
| translate: 1.5rem 1.5rem; | translate-6 |
| translate: 1.75rem 0; | translate-x-7 |
| translate: 1.75rem 1.75rem; | translate-7 |
| translate: 2rem 0; | translate-x-8 |
| translate: 2rem 2rem; | translate-8 |
| translate: 2.25rem 0; | translate-x-9 |
| translate: 2.25rem 2.25rem; | translate-9 |
| translate: 2.5rem 0; | translate-x-10 |
| translate: 2.5rem 2.5rem; | translate-10 |
| translate: 2.75rem 0; | translate-x-11 |
| translate: 2.75rem 2.75rem; | translate-11 |
| translate: 3rem 0; | translate-x-12 |
| translate: 3rem 3rem; | translate-12 |
| translate: 3.5rem 0; | translate-x-14 |
| translate: 3.5rem 3.5rem; | translate-14 |
| translate: 4rem 0; | translate-x-16 |
| translate: 4rem 4rem; | translate-16 |
| translate: 5rem 0; | translate-x-20 |
| translate: 5rem 5rem; | translate-20 |
| translate: 6rem 0; | translate-x-24 |
| translate: 6rem 6rem; | translate-24 |
| translate: 7rem 0; | translate-x-28 |
| translate: 7rem 7rem; | translate-28 |
| translate: 8rem 0; | translate-x-32 |
| translate: 8rem 8rem; | translate-32 |
| translate: 8.333333% 0; | translate-x-1/12 |
| translate: 8.333333% 8.333333%; | translate-1/12 |
| translate: 9rem 0; | translate-x-36 |
| translate: 9rem 9rem; | translate-36 |
| translate: 10rem 0; | translate-x-40 |
| translate: 10rem 10rem; | translate-40 |
| translate: 11rem 0; | translate-x-44 |
| translate: 11rem 11rem; | translate-44 |
| translate: 12rem 0; | translate-x-48 |
| translate: 12rem 12rem; | translate-48 |
| translate: 13rem 0; | translate-x-52 |
| translate: 13rem 13rem; | translate-52 |
| translate: 14rem 0; | translate-x-56 |
| translate: 14rem 14rem; | translate-56 |
| translate: 15rem 0; | translate-x-60 |
| translate: 15rem 15rem; | translate-60 |
| translate: 16rem 0; | translate-x-64 |
| translate: 16rem 16rem; | translate-64 |
| translate: 16.666667% 0; | translate-x-1/6 |
| translate: 16.666667% 16.666667%; | translate-1/6 |
| translate: 18rem 0; | translate-x-72 |
| translate: 18rem 18rem; | translate-72 |
| translate: 20% 0; | translate-x-1/5 |
| translate: 20% 20%; | translate-1/5 |
| translate: 20rem 0; | translate-x-80 |
| translate: 20rem 20rem; | translate-80 |
| translate: 24rem 0; | translate-x-96 |
| translate: 24rem 24rem; | translate-96 |
| translate: 25% 0; | translate-x-1/4 |
| translate: 25% 25%; | translate-1/4 |
| translate: 33.333333% 0; | translate-x-1/3 |
| translate: 33.333333% 33.333333%; | translate-1/3 |
| translate: 40% 0; | translate-x-2/5 |
| translate: 40% 40%; | translate-2/5 |
| translate: 41.666667% 0; | translate-x-5/12 |
| translate: 41.666667% 41.666667%; | translate-5/12 |
| translate: 50% 0; | translate-x-1/2 |
| translate: 50% 50%; | translate-1/2 |
| translate: 58.333333% 0; | translate-x-7/12 |
| translate: 58.333333% 58.333333%; | translate-7/12 |
| translate: 60% 0; | translate-x-3/5 |
| translate: 60% 60%; | translate-3/5 |
| translate: 66.666667% 0; | translate-x-2/3 |
| translate: 66.666667% 66.666667%; | translate-2/3 |
| translate: 75% 0; | translate-x-3/4 |
| translate: 75% 75%; | translate-3/4 |
| translate: 80% 0; | translate-x-4/5 |
| translate: 80% 80%; | translate-4/5 |
| translate: 83.333333% 0; | translate-x-5/6 |
| translate: 83.333333% 83.333333%; | translate-5/6 |
| translate: 91.666667% 0; | translate-x-11/12 |
| translate: 91.666667% 91.666667%; | translate-11/12 |
| translate: 100% 0; | translate-x-full |
| translate: 100% 100%; | translate-full |
| translate: none; | translate-none |
Other transforms properties
Converting a whole stylesheet?
Paste it into the converter and get every rule at once, shorthands expanded, media queries turned into breakpoint variants, and the parts that have no Tailwind equivalent flagged rather than dropped.
Open the converter