06.
Movimento discreto.
Animação no AP serve pra confirmar interação, nunca pra entreter. Easing único. Três durações.
Easing & durações
| Token | Valor | Uso |
|---|---|---|
| --ease-out | cubic-bezier(0.2, 0.8, 0.2, 1) | Padrão de saída para qualquer transição. |
| --d-micro | 150ms | Hover, change de cor, foco. |
| --d-ui | 250ms | Abrir menu, expandir card, fade in. |
| --d-page | 400ms | Transição de página, modal. |
Demos
Pulse · brand pulse
Loop em laranja AP. Status "ao vivo" ou "ativo".
Hover · botão primário
150ms · cor sobe um stop · sem deslocamento.
Anti-padrões
Nada de animação ao scroll com parallax. Nada de bounce. Nada de fade lento acima de 400ms. Reduce-motion sempre respeitado.