Press/to search

Transforms

Translate

Utilities for translate an element that has transform applied.


Class

classcss
translate-x-0--transform-translate-x: 0
translate-x-1--transform-translate-x: 0.25rem
translate-x-2--transform-translate-x: 0.5rem
translate-x-3--transform-translate-x: 0.75rem
translate-x-4--transform-translate-x: 1rem
translate-x-5--transform-translate-x: 1.25rem
translate-x-6--transform-translate-x: 1.5rem
translate-x-8--transform-translate-x: 2rem
translate-x-10--transform-translate-x: 2.5rem
translate-x-12--transform-translate-x: 3rem
translate-x-16--transform-translate-x: 4rem
translate-x-20--transform-translate-x: 5rem
translate-x-24--transform-translate-x: 6rem
translate-x-32--transform-translate-x: 8rem
translate-x-40--transform-translate-x: 10rem
translate-x-48--transform-translate-x: 12rem
translate-x-56--transform-translate-x: 14rem
translate-x-64--transform-translate-x: 16rem
translate-x-px--transform-translate-x: 1px
-translate-x-1--transform-translate-x: -0.25rem
-translate-x-2--transform-translate-x: -0.5rem
-translate-x-3--transform-translate-x: -0.75rem
-translate-x-4--transform-translate-x: -1rem
-translate-x-5--transform-translate-x: -1.25rem
-translate-x-6--transform-translate-x: -1.5rem
-translate-x-8--transform-translate-x: -2rem
-translate-x-10--transform-translate-x: -2.5rem
-translate-x-12--transform-translate-x: -3rem
-translate-x-16--transform-translate-x: -4rem
-translate-x-20--transform-translate-x: -5rem
-translate-x-24--transform-translate-x: -6rem
-translate-x-32--transform-translate-x: -8rem
-translate-x-40--transform-translate-x: -10rem
-translate-x-48--transform-translate-x: -12rem
-translate-x-56--transform-translate-x: -14rem
-translate-x-64--transform-translate-x: -16rem
-translate-x-px--transform-translate-x: -1px
-translate-x-full--transform-translate-x: -100%
-translate-x-1/2--transform-translate-x: -50%
translate-x-1/2--transform-translate-x: 50%
translate-x-full--transform-translate-x: 100%
translate-y-0--transform-translate-y: 0
translate-y-1--transform-translate-y: 0.25rem
translate-y-2--transform-translate-y: 0.5rem
translate-y-3--transform-translate-y: 0.75rem
translate-y-4--transform-translate-y: 1rem
translate-y-5--transform-translate-y: 1.25rem
translate-y-6--transform-translate-y: 1.5rem
translate-y-8--transform-translate-y: 2rem
translate-y-10--transform-translate-y: 2.5rem
translate-y-12--transform-translate-y: 3rem
translate-y-16--transform-translate-y: 4rem
translate-y-20--transform-translate-y: 5rem
translate-y-24--transform-translate-y: 6rem
translate-y-32--transform-translate-y: 8rem
translate-y-40--transform-translate-y: 10rem
translate-y-48--transform-translate-y: 12rem
translate-y-56--transform-translate-y: 14rem
translate-y-64--transform-translate-y: 16rem
translate-y-px--transform-translate-y: 1px
-translate-y-1--transform-translate-y: -0.25rem
-translate-y-2--transform-translate-y: -0.5rem
-translate-y-3--transform-translate-y: -0.75rem
-translate-y-4--transform-translate-y: -1rem
-translate-y-5--transform-translate-y: -1.25rem
-translate-y-6--transform-translate-y: -1.5rem
-translate-y-8--transform-translate-y: -2rem
-translate-y-10--transform-translate-y: -2.5rem
-translate-y-12--transform-translate-y: -3rem
-translate-y-16--transform-translate-y: -4rem
-translate-y-20--transform-translate-y: -5rem
-translate-y-24--transform-translate-y: -6rem
-translate-y-32--transform-translate-y: -8rem
-translate-y-40--transform-translate-y: -10rem
-translate-y-48--transform-translate-y: -12rem
-translate-y-56--transform-translate-y: -14rem
-translate-y-64--transform-translate-y: -16rem
-translate-y-px--transform-translate-y: -1px
-translate-y-full--transform-translate-y: -100%
-translate-y-1/2--transform-translate-y: -50%
translate-y-1/2--transform-translate-y: 50%
translate-y-full--transform-translate-y: 100%

Variant

ResponsiveDark ModeLight ModeReduce-MotionPortraitLandscapeHoverGroup-HoverFocusGroup-FocusFocus-VisibleFocus-WithinActiveVisitedCheckedDisabled

Default enabled variants. Read more information about the Responsive and Pseudo-Class Variants.