chevron_right

Generador de Keyframes CSS

Crea keyframes CSS personalizados de forma visual con vista previa en vivo y código listo para copiar.

Nombre del keyframe

Duracion (s)

Aceleracion

Iteraciones

Repetir sin fin

Estado inicial

Trasladar X (px)

Trasladar Y (px)

Escala

Opacidad

Estado intermedio

Trasladar X (px)

Trasladar Y (px)

Escala

Opacidad

Estado final

Trasladar X (px)

Trasladar Y (px)

Escala

Opacidad

Vista previa en vivo

Pulso

CSS generado

css

Herramientas similares

Generador de Texto Degradado CSS

Crea estilos de texto con degradado mediante controles visuales, vista previa en vivo y CSS listo para copiar.

Generador de animaciones CSS

Crea animaciones CSS reutilizables con vista previa de movimiento y keyframes listos para copiar.

Generador CSS Grid

Crea diseños CSS Grid responsivos con vista previa en vivo y código listo para copiar.

Generador de borde degradado

Genere CSS para bordes degradados con ángulo y ancho ajustables.

Cambiar DPI de imagen

Cambia el DPI de imágenes PNG y JPEG actualizando los metadatos o remuestreando a una nueva resolución.

Texto a Binario

Convierte texto en código binario (0s y 1s) con desglose por carácter.

Calculadora de edad

Calcula la edad desde una fecha de nacimiento con desglose en anos, meses y dias.

apps

Mas herramientas

Explora nuestra coleccion completa de herramientas gratuitas en linea.

Construye keyframes visualmente antes de escribir la animación a mano

Los keyframes personalizados te dan más control que una animación prefabricada, pero escribirlos desde cero frena la experimentación. Este generador te ayuda a definir estados de movimiento de forma visual y luego copiar CSS limpio cuando la secuencia ya se siente bien.

Cuándo resulta especialmente útil

Va muy bien para prototipar transiciones, crear movimiento propio para una marca y comparar variantes de animación antes de elegir una. Después de generar el código, conviene verlo en el contexto real de la interfaz para confirmar que el movimiento sigue pareciendo intencional.