Malevich

Motion

Three durations × four easings. Each row plays live; reduced-motion mutes the animation.

Durations

motion-duration-base
200ms
motion-duration-fast
120ms
motion-duration-slow
320ms
motion-base
200ms
motion-fast
120ms
motion-slow
320ms

Easings

motion-easing-default
cubic-bezier(0.4, 0, 0.2, 1)
motion-easing-in
cubic-bezier(0.4, 0, 1, 1)
motion-easing-in-out
cubic-bezier(0.4, 0, 0.2, 1)
motion-easing-out
cubic-bezier(0, 0, 0.2, 1)
motion-easing-default
cubic-bezier(0.4, 0, 0.2, 1)
motion-easing-in
cubic-bezier(0.4, 0, 1, 1)
motion-easing-out
cubic-bezier(0, 0, 0.2, 1)