Generador CSS cubic-bezier
Arrastra los dos controles para dar forma a una curva de easing, prueba un preset y pulsa Reproducir para sentir el timing. Copia el valor cubic-bezier() listo para usar — todo se actualiza en vivo en tu navegador.
Todo funciona en tu navegador. Sin subidas, sin registro.
Cómo funciona
Da forma a la curva
Arrastra los dos controles de colores sobre la curva. Cada uno es un punto de control: su X está limitado a 0–1, mientras que Y puede sobrepasar ese rango para crear easing elástico.
Previsualiza el movimiento
Pulsa Reproducir para animar un cuadro a lo largo del carril usando tu curva como CSS transition-timing-function, de modo que puedas sentir el easing, no solo ver la línea.
Copia el valor
Copia el valor cubic-bezier(x1, y1, x2, y2) — o la línea de transición completa — con un clic y pégalo en tu hoja de estilos. No se sube nada.