motionlang · motion lab

vercel.com in motion

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

Easing curves

ease-in-out 38×
ease
easing-2
cubic-bezier(0.4, 0, 0.2, 1)
easing-3
cubic-bezier(0.39, 0.18, 0.17, 0.99)
ease-out
cubic-bezier(0.14, 0.55, 0.3, 0.92)
spring
cubic-bezier(0.31, 0.05, 0.43, 1.02)
easing-6 10×
cubic-bezier(0.33, 0.12, 0.15, 1)
ease-out
cubic-bezier(0.3, 0.57, 0.07, 0.95)

Durations

xs 90ms
sm 160ms
md 300ms

Keyframe animations

@keyframes soft-fade-in

    
@keyframes show

    
@keyframes hide

    
@keyframes fade-in

    
@keyframes fade-out

    
@keyframes spinner-opacity

    
@keyframes slide-in

    
@keyframes blue-glow

    
@keyframes thinking-loader

    
@keyframes logo-carousel

    
@keyframes sandbox-left

    
@keyframes sandbox-right