# Tag: Animação CSS

> Posts do dpw marcados com a tag Animação CSS.

URL: https://dpw.dev/tag/animacao-css/

## Posts

- [Como animar border-image em CSS](https://dpw.dev/css/animar-border-image-css/): Como animar border-image com gradientes, custom properties registradas e border-image-slice para criar bordas que se desenham sozinhas no hover.
- [Como usar scroll-driven animations em direções opostas](https://dpw.dev/css/scroll-driven-animations-direcoes-opostas/): Como fazer colunas se moverem em direções opostas durante a rolagem com scroll-driven animations, animation-timeline e a função view() do CSS.
- [Layouts matemáticos com sibling-index() e sibling-count()](https://dpw.dev/css/sibling-index-sibling-count-css/): As funções sibling-index() e sibling-count() levam a contagem de elementos para o CSS: animações escalonadas, larguras e menus radiais sem JavaScript.
- [Como usar e estilizar Dialog](https://dpw.dev/css/usar-estilizar-dialog-html-css/): Como usar e estilizar o elemento dialog: show() e showModal(), invoker commands, acessibilidade, inércia, estilização do ::backdrop, posicionamento e animações.
- [7 receitas de View Transitions para experimentar](https://dpw.dev/css/7-receitas-de-view-transitions/): Sete animações prontas para páginas com View Transitions do CSS — pixel dissolve, wipe, rotação, círculo, diagonal, cortina e 3D flip.
- [A grande expansão do CSS](https://dpw.dev/css/a-grande-expansao-do-css/): CSS agora faz nativamente o que Floating UI, GSAP, Framer Motion e react-select exigiam em JavaScript. Veja quanto isso economiza e o que ainda falta.
- [10 dicas para melhores animações e transições CSS](https://dpw.dev/css/10-dicas-animacoes-transicoes-css/): Aprenda 10 técnicas essenciais para criar animações e transições CSS fluidas e profissionais. Descubra como melhorar dramaticamente a UX do seu site!
- [Os benefícios de performance de animações CSS](https://dpw.dev/css/animacoes-css-beneficios-performance/): CSS ou JavaScript para animações web? Descubra métricas de performance reais, técnicas de otimização e por que transform supera position absolute. Compare!
- [Animação de loading com CSS puro](https://dpw.dev/css/animacao-loading-css/): Crie animações de loading leves e performáticas com CSS puro facilmente. Elimine gifs pesados e melhore performance sem bibliotecas JavaScript. Otimize!
- [Introdução a Animações CSS](https://dpw.dev/css/animacoes-css-introducao/): Domine os fundamentos de animações CSS do zero. Aprenda keyframes, propriedades animation-* e easings para criar experiências visuais impactantes. Anime!
- [Filtros CSS (CSS Filter Effects)](https://dpw.dev/css/filtros-css3-filter-effects-css/): Guia completo de filtros CSS3 (filter effects). Aprenda blur, brightness, contrast, saturate e outros efeitos visuais nativos impressionantes. Domine!

---

Fonte: [dpw - desenvolvimento para web](https://dpw.dev/) (pt-BR).
Guia para agentes: https://dpw.dev/llms.txt
Índice completo: https://dpw.dev/sitemap-index.xml
Feed: https://dpw.dev/rss.xml