Podemos agregar movimiento a nuestras páginas web. Las transformaciones modifican la forma y posición de un elemento sin afectar el resto de la página. Como resultado, podremos crear los siguientes efectos:

Podemos agregar escalado a los elementos:

Podemos agregar rotación a los elementos:

Podemos agregar traslación a los elementos:

Podemos agregar inclinación a los elementos:

Nota

Todos estos efectos se logran con la ayuda de una sola propiedad: transform, utilizando diferentes valores. Además, es importante mencionar que animation y @keyframe se agregan solo para mostrar la diferencia entre el estado inicial y el estado final del elemento. Esto no significa que transform se use únicamente con algunas animaciones. Analizaremos todos los efectos en detalle en los próximos capítulos.