برای داشتن انیمیشن و ترنزیشن های واقعی تر و با معنا نیاز داریم تا مقدار timing-function را به خوبی تنظیم کنیم.
<timing-function>
<timing-function> یک تابع ریاضیاتی است که سرعت یک شی که دارای انیمیشن یا ترنزیشن هست را در طول زمان مشخص می کند. این تابع نحوه پیشرفت ترنزیشن و یا انیمیشن را در یک چرخه دوره زمانیشان توصیف می کند.