# Animation.

## Duration.

| CSS custom property | Wert / Value |
| --- | --- |
| `--sbb-animation-duration-1x` | 0.04s |
| `--sbb-animation-duration-2x` | 0.08s |
| `--sbb-animation-duration-3x` | 0.12s |
| `--sbb-animation-duration-4x` | 0.16s |
| `--sbb-animation-duration-5x` | 0.20s |
| `--sbb-animation-duration-6x` | 0.24s |
| `--sbb-animation-duration-12x` | 0.48s |

## Easing.

| CSS custom property | Wert / Value |
| --- | --- |
| `--sbb-animation-easing` | cubic-bezier(.47, .1, 1, .63) |

---

Source: https://digital.sbb.ch/en/design-system/lyne/design-tokens/animation/