Foundations · motion · 6 durations · 6 easings
Motion
Carbon's motion vocabulary. Six durations, six easings — productive (chrome) vs expressive (decorative). Click the demos to replay.
Durations
--duration-fast-0170 ms--duration-fast-02110 ms--duration-moderate-01150 ms--duration-moderate-02240 ms--duration-slow-01400 ms--duration-slow-02700 msEasings
--ease-productive-standardcubic-bezier(0.2, 0, 0.38, 0.9)--ease-productive-entrancecubic-bezier(0, 0, 0.38, 0.9)--ease-productive-exitcubic-bezier(0.2, 0, 1, 0.9)--ease-expressive-standardcubic-bezier(0.4, 0.14, 0.3, 1)--ease-expressive-entrancecubic-bezier(0, 0, 0.3, 1)--ease-expressive-exitcubic-bezier(0.4, 0.14, 1, 1)