Motion path
Propiedades CSS que mueven un elemento a lo largo de una curva arbitraria en vez de trazar una línea recta entre dos puntos.
La ruta se define con offset-path, normalmente con la sintaxis habitual de rutas SVG, y la posición a lo largo de ella con offset-distance expresada en porcentaje. Animar este último valor de cero a cien hace que el elemento se deslice por la curva, y con offset-rotate: auto el elemento gira para apuntar en la dirección del movimiento — la diferencia entre mover un avión y pilotarlo. La ruta también puede ser un ray() con ángulo y longitud, una forma básica, o una referencia a una ruta dentro de un documento SVG. Antes hacía falta una librería de JavaScript que recalculara la posición en cada fotograma, o el propio animateMotion de SVG, que solo funcionaba dentro de SVG. Soporte amplio desde 2022.