Cubic-bezier ¿suena raro verdad? Pues es la curva de tiempo que usan todas las transiciones CSS, además de ser un valor mas de la propiedad "transition-timing-function". Dicho de otro modo, cuando realizamos una transición CSS, tenemos que especificar como se moverá la animación, seleccionando entre distintas funciones de tiempo como: ease, linear, ease-in, ease-out, etc. Pues bien,  todas estas funciones están basadas en la función cubic-bezier, la cual podemos adaptar a nuestro gusto.

• ease: especifica que la transición CSS comenzara lentamente, luego ira mas rápida, y terminara reduciendo su velocidad otra vez, lo que equivalente a cubic Bezier (0.25,0.1,0.25,1).
• linear: especifica que la transición sera constante, con la misma velocidad de principio a fin. Equivalente a cubic-bezier (0,0,1,1).
• ease-in: en este caso la transición CSS tendrá un comienzo lento equivalente a cubic-bezier (0.42,0,1,1).
• ease-out: en el extremo opuesto al anterior, tenemos una transición con un final lento, lo que equivale a cubic-bezier (0,0,0.58,1).
• ease-in-out: si combinamos los dos anteriores, el resultado seria un inicio y un final lento. Equivalente a cubic-bezier (0.42,0,0.58,1).
   

• cubic-bezier(n,n,n,n): donde n es un valor entre 0 y 1. Jugando con estos valores, vamos a poder obtener la velocidad deseada en cada momento de la animación.
   

transition-timing-function: cubic-bezier(.86,-1.15,.48,1.68);
-webkit-transition-timing-function: cubic-bezier(.86,-1.15,.48,1.68);

<div id="contenedor">
    <div class="coche"></div>
</div>

#contenedor{
 
    overflow:hidden;
}
#contenedor:hover .coche{
             
    margin-left:100%;
    transition:all 2s;
    -webkit-transition:all 2s;
    transition-timing-function: cubic-bezier(1,.46,.48,1.68);
    -webkit-transition-timing-function: cubic-bezier(1,.46,.48,1.68);
}
.coche{
         
    background: url(coche.png) no-repeat center;
    width:200px;
    height:100px;      
}

• CSS cubic-bezier Builder. Esta aplicación web de Rob La Placa nos permite modificar la curva, y compara su animación con todas las funciones predefinidas al mismo tiempo, mediante el desplazamiento de una serie de cuadrados. En la parte de abajo muestra el código entero de las transiciones CSS, con sus respectivos prefijos para cada navegador.
• Cubic-bezier. Similar a la anterior pero en esta podemos guardar las curvas que vayamos generando. Al terminar pulsar "save" y se abrirá una ventana con los dígitos listos para pegar en nuestro CSS. 
• Ceaser. Esta aplicación de Matthew Lein nos permite probar la curva con distintos tipos de animación, como width, height y opacity. Ademas cuenta con varios tipos de curva predefinidos, aparte de los que ya existen por defecto.

No esta de más reconocer que este articulo esta basado en otro similar que el autor leyó en honkiat 

Artículo seleccionado del Blog de Agustin Baraza en www.nosolocss.com/