styles

Motion

Motion shows what changed and where it came from, without slowing anyone down.

--ds-duration-* and --ds-easing-*, used by tw-duration-* and tw-ease-*.

Durations

  • 150ms
    fast150ms
    --ds-duration-fasttw-duration-fast
  • 250ms
    base250ms
    --ds-duration-basetw-duration-base
  • 400ms
    slow400ms
    --ds-duration-slowtw-duration-slow

Easings

  • cubic-bezier(0.2, 0, 0, 1)
    standardcubic-bezier(0.2, 0, 0, 1)
    --ds-easing-standardtw-ease-standard