translate
An individual transform property that moves an element in 2D or 3D space without needing the shorthand transform property.
Quick example
.slide-in {
translate: -100% 0;
/* moves the element entirely off-screen to the left */
}Quick facts
Initial value
noneInherited
No
Applies to
transformable elements
Animation type
transform
Values
none translate Browser Support
Widely available Since 2022 94% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2022.
Safe to use without fallbacks.
104+
72+
14.1+
104+