Crea animaciones CSS con keyframes de forma visual. Elige entre 16 presets, personaliza la temporización y copia el código al instante.
Esta herramienta te ayuda a crear animaciones CSS @keyframes sin escribir código. Elige entre 16 presets integrados como desvanecer, rebotar, pulsar y rotar — luego personaliza duración, retraso, suavizado y más. Ve los cambios en tiempo real y copia CSS listo para producción al instante.
Los @keyframes de CSS definen pasos intermedios en una secuencia de animación. Especificas estilos CSS en porcentajes clave (0%, 50%, 100%) y el navegador interpola entre ellos para crear animaciones suaves.
¡Sí! El CSS generado utiliza propiedades estándar de @keyframes y animación compatibles con todos los navegadores modernos. No se necesita JavaScript en tiempo de ejecución.
Puedes combinar múltiples animaciones usando las clases CSS generadas juntas o encadenando nombres de animación en la propiedad corta con comas.