#animation-duration

#Introduction

animation-duration property specifies the length of time that an animation should take to complete one cycle.

#Examples

css-apisrc/animation-duration/App.tsx

Preview

#Syntax

/* Single animation */
animation-duration: 6s
animation-duration: 120ms

/* Multiple animations */
animation-duration: 1s, 15s
animation-duration: 10s, 30s, 230ms

#Caution

#Formal definition

#Formal syntax

/* default value: 0s */
animation-duration: <time>;

#See also

• animation
• animation-name
• animation-duration
• animation-timing-function
• animation-delay
• animation-iteration-count
• animation-direction
• animation-fill-mode
• animation-play-state
• CSS animation event
• Animated API

#Compatibility