Gerador de Animações CSS
Crie animações CSS visualmente. Escolha presets, ajuste duração, timing e direção. Copie o código CSS com @keyframes. Grátis, 100% no seu navegador.
Visualização
Saída CSS
Referência
O que são animações CSS?
As animações CSS permitem transições fluidas entre estados CSS por meio de regras @keyframes. Oferecem controle total sobre duração, timing, atraso, iterações e direção — sem JavaScript.
Presets de animação
Animações comuns incluem fade-in (aparecer), slide-in (deslizar), pulse (pulsar), bounce (quicar), spin (girar) e shake (sacudir). Cada preset define keyframes @keyframes que você pode personalizar.
Privacidade
Todo o processamento é executado 100% no seu navegador. Nenhum dado é enviado a servidores.