Toolipedia
ES
← Todas las herramientas de texto

Generador de animaciones CSS

Rebote, fundido, sacudida, deslizamiento y más como @keyframes, listos para copiar.

  • Gratis
  • Sin registro
  • Funciona en cualquier dispositivo

Acerca de Generador de animaciones CSS

Elige un efecto ya hecho como rebote, desvanecimiento, sacudida, pulso o deslizamiento, ajusta la duración y el retraso, y copia la regla @keyframes con la propiedad animation. Limítate a transform y opacity siempre que sea posible, porque los navegadores los animan con fluidez sin recalcular el diseño de la página.

Cómo usar Generador de animaciones CSS

  1. Configura las opciones de arriba. El resultado se actualiza en directo.
  2. Cambia lo que quieras hasta que quede perfecto.
  3. Copia el resultado o descárgalo.

¿Por qué usar esta herramienta?

También conocida como

Preguntas frecuentes

¿Cómo hago que una animación CSS se repita para siempre?

Define animation-iteration-count como infinite, o usa infinite en la forma abreviada de animation. Añade una función de temporización como ease-in-out para que el bucle se sienta natural.

¿Es gratis Generador de animaciones CSS?

Sí. Generador de animaciones CSS de Toolipedia es de uso gratuito, sin registro y sin marca de agua.

¿Es seguro usarlo?

Sí. Todo se calcula en tu navegador y nada de lo que introduces se envía a nuestro servidor.

¿Funciona en mi teléfono?

Sí. Funciona en cualquier navegador moderno en Android y iPhone, y también en tabletas y computadoras. No hay que instalar nada.

¿Necesito una cuenta?

No. Solo abre la página y usa la herramienta. No hace falta registrarse ni dar un correo electrónico.

Herramientas relacionadas