Foundations · 06
Motion.
Movimento existe para explicar mudança de estado, nunca para decorar.
Tokens de movimento
motion.instant
80ms
Retorno de clique e mudança de estado imediata
motion.fast
160ms
Hover, foco e realce de item de menu
motion.base
240ms
Abertura de painel, accordion e chip
motion.slow
400ms
Transição de página e revelação de bloco
ease.standard
cubic-bezier(0.2, 0, 0, 1)
Curva padrão do sistema
ease.exit
cubic-bezier(0.4, 0, 1, 1)
Saída de elementos
Regras
- Nada acima de 400ms em interface de leitura.
- Sem quique, sem elástico, sem paralaxe decorativa.
- Opacidade e deslocamento curto bastam para quase todo caso.
- Respeitar a preferência de movimento reduzido do sistema operacional.