Smooth Gradient Overlays
Light
Smoothed
Simple
CSS Output
Dark
Smoothed
Simple
CSS Output
Controls
The curve shows the easing function, while the straight lines represent the discrete linear gradient stops that approximate it.
8
easeOutQuad
easeInOutQuad
easeOutCubic
easeInOutCubic
easeOutQuint
easeInOutQuint
easeOutExpo
easeInOutExpo
easeOutCirc
easeInOutCirc