Líneas de tiempo de animación CSS: construcción de una máquina Rube Goldberg

Si vas a crear una animación o transición CSS de varios pasos, te enfrentas a un enigma particular. El segundo paso necesita un retraso igual a la duración del primer paso. Y el tercer paso es igual a la duración de los dos primeros pasos, más cualquier retraso intermedio. Se vuelve cada vez más complicado hasta que podrías decir, nahhhhh, usaré más tecnología para ayudarme .

Pablo Hebert:

Últimamente he estado usando propiedades personalizadas para planificar líneas de tiempo CSS puras para animaciones complejas.

Fresco. Y puede volverse completamente loco .