Motion

Durations and easing curves, and one rule that covers the rest: the system respects «reduce motion» wholesale, through a single block in the base layer rather than component by component.

  • Where the setting changes the scenario rather than the speed — an autoplaying carousel should not be sped up but not started — the component reads matchMedia itself.

Motion

TokenValue
--gr-duration-fast--gr-duration-fast150ms
--gr-duration-base--gr-duration-base200ms
--gr-duration-slow--gr-duration-slow300ms
--gr-ease-out--gr-ease-outcubic-bezier(0.16, 1, 0.3, 1)
--gr-ease-in--gr-ease-incubic-bezier(0.7, 0, 0.84, 0)

Role descriptions ship with the package in Russian and are not shown here yet. Translating them is a decision of its own — see ADR-0003.

Source: @feugene/granularity 0.41.0, tokens/*.json