Sofia Emelianova
A guia Animações do Chrome DevTools é uma ferramenta poderosa que ajuda você a desacelerar, reproduzir, ajustar os tempos da animação CSS e ver os resultados imediatamente.
Enquanto aberta, a guia Animações grava animações automaticamente, agrupa-as de maneira conveniente e permite:
- Reproduza e desacelere as animações para uma melhor inspeção.
- Ajuste durações, tempos e atrasos arrastando pontos em uma linha do tempo em vez de adivinhar e definir os valores CSS manualmente.
Além disso, é possível editar os tempos de easing e definir valores personalizados de curva cubic-bezier com o Editor de easing no painel Elementos > Estilos. Para saber mais, consulte Editar animações e tempos de transição com o Editor de easing.
Para uma experiência de aprendizado mais prática, siga o guia Inspecionar e modificar efeitos de animação CSS.