Las transiciones CSS permiten cambiar los valores de las propiedades de estilo de un valor inicial a un valor final, de manera sutil y en una duración de tiempo (segundos) indicada. La propiedad que hace posible este cambio es transition. Puede considerarse como una animación bastante básica donde las propiedades del elemento van cambiando en función del tiempo y de una manera suave. Las transiciones suelen ejecutarse cuando se recibe una cierta acción del usuario. Por ejemplo, cuando el usuario pasa el puntero del mouse sobre el elementos HTML (:hover). El siguiente ejemplo de [3] muestra el código para realizar una transición en 2 segundos de la propiedad backgroud (color de fondo) de la caja. En el transcurso de 2 segundos, el color de fondo de la caja pasará suavemente de rojo a azul, una vez que el usuario pase el mouse sobre la caja.

Es posible transicionar varias propiedades. Para esto se indica la lista de propiedades junto con el tiempo de duración. Ejemplo, transition: width 4s, backgroud 3s;