<easing-function>
Mathematical functions that control the speed of an animation over time (e.g., starting slow and ending fast). Common ones include 'ease-in', 'ease-out', and the customizable 'cubic-bezier()'.
Quick example
.animated-box {
transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
/* custom easing function for a unique feel */
}<easing-function> Browser Support
Widely available Since 2015 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.
Safe to use without fallbacks.
4+
4+
3.1+
12+