motionlang · motion lab

stripe.com in motion

Every easing curve, duration and keyframe animation designlang read off the live stripe.com page — drawn, timed and replayed. Generated 2026-05-21.

Easing curves

easing-1 13×
cubic-bezier(0.45, 0.05, 0.55, 0.95)
easing-2
cubic-bezier(0.4, 0, 0.2, 1)
easing-3
cubic-bezier(0.6, 0, 0.2, 0.5)
ease-out 467×
cubic-bezier(0.25, 1, 0.5, 1)
ease-in-out
ease
linear 45×
linear
steps 10×
non-bezier
steps(1)
ease-out 55×
cubic-bezier(0.165, 0.84, 0.44, 1)
ease-out 20×
cubic-bezier(0.16, 1, 0.3, 1)
ease-out
cubic-bezier(0.33, 1, 0.68, 1)
easing-11 13×
cubic-bezier(0.65, 0, 0.35, 1)
easing-12 16×
cubic-bezier(0.3, 0, 0.2, 1)

Durations

xs 100ms
sm 200ms
md 300ms
lg 500ms
xl 800ms

Keyframe animations

No @keyframes animations detected on this page.