Generador de animaciones CSS Keyframe
El generador de animaciones CSS Keyframe te permite elegir un tipo de animación entre 12 estilos predefinidos (aparecer/desaparecer, deslizar desde las cuatro direcciones, acercar/alejar, rebote, rotar al entrar, voltear en el eje X o Y), luego ajustar la duración, el retraso, la función de tiempo y el número de iteraciones, con una vista previa en vivo y un botón de repetir. Copia la regla @keyframes completa junto con una clase de animación lista para usar. Toda la generación ocurre en tu navegador — nunca se sube nada a un servidor.
El código se genera completamente en tu navegador — nunca se envía nada a un servidor.
Código CSS
@keyframes uddatakAnim {
0% { opacity: 0; }
100% { opacity: 1; }
}
.animated-box {
animation: uddatakAnim 800ms ease-out 0ms 1;
}Preguntas Frecuentes
Sí, @keyframes y la propiedad animation son compatibles con todos los navegadores modernos sin necesidad de prefijos especiales.
Continuar con
Herramientas relacionadas
¿Listo para probar Uddatak?
Explora la biblioteca completa de herramientas y empieza a usar lo que necesitas ahora mismo — gratis, sin registro.
Explorar todas las herramientas