Разница между transition-duration и transition-timing-function заключается в том, что первое определяет длительность перехода, а второе — его скорость в разные моменты времени. 12

transition-duration задаёт время, в течение которого будет завершён переход, в секундах (s) или миллисекундах (ms). 24

transition-timing-function определяет, каким образом будет проходить процесс анимации, задавая временную функцию, которая описывает скорость перехода объекта от одного значения к другому. 5 Например, по умолчанию переход ускоряется в начале и замедляется в конце (transition-timing-function: ease). 4

Таким образом, transition-duration указывает, как долго будет длиться анимация, а transition-timing-function — каким образом она будет протекать. 4