Toolipedia Insertar
ES
← Todas las herramientas de texto

Generador de cubic bezier

Arrastra una curva para diseñar la aceleración CSS, mírala animarse y copia la función de tiempo.

  • Gratis
  • Sin registro
  • Funciona en cualquier dispositivo

Acerca de Generador de cubic bezier

Arrastra los dos controles de una curva de Bézier para diseñar una función de aceleración personalizada para transiciones y animaciones CSS, mira cómo se anima una pelota con ella y copia el valor cubic-bezier(x1, y1, x2, y2). Los valores x deben permanecer entre 0 y 1, mientras que y puede sobrepasar para lograr un efecto de rebote.

Cómo usar Generador de cubic bezier

  1. Arrastra los dos tiradores de la curva para dar forma a la aceleración.
  2. Pulsa reproducir para ver moverse un elemento con tu temporización.
  3. Copia la función cubic-bezier en tu transición o animación.

¿Por qué usar esta herramienta?

También conocida como

Preguntas frecuentes

¿Qué significan los cuatro números de cubic-bezier?

Son las coordenadas x e y de dos puntos de control en la curva de velocidad. Los tramos más empinados significan movimiento más rápido y los más planos, movimiento más lento.

¿Puede la curva salirse de la caja?

Los valores verticales pueden superar 0 y 1, lo que crea un rebasamiento o rebote. Los valores horizontales deben mantenerse entre 0 y 1.

¿Qué curva resulta natural para el movimiento de una interfaz?

Una curva de estilo ease-out, rápida al principio y lenta al final, resulta ágil para los elementos que entran en pantalla. Prueba primero con duraciones cortas.

¿Es gratis Generador de cubic bezier?

Sí. Generador de cubic bezier 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.

¿Puedo poner Generador de cubic bezier en mi propio sitio web?

Sí. Usa el botón «Insertar en tu sitio» debajo de la herramienta para copiar un fragmento corto de código y pegarlo en tu página. Es gratis, no necesita cuenta y la herramienta sigue funcionando dentro de tu página.

Herramientas relacionadas