0Pricing
CSS Academy · Lesson

Transition Property Duration and Timing

Define which properties transition, how long they take, and when they start with delay.

What is a CSS Transition?

A CSS transition interpolates between two property values over a specified duration when the value changes (e.g., on hover). No JavaScript is needed.

transition-property

Specifies which CSS properties to animate. Use all to transition every animatable property, or list specific properties.

button {
  transition-property: background-color, box-shadow;
}

All lessons in this course

  1. Transition Property Duration and Timing
  2. Easing Functions: ease linear cubic-bezier
  3. Transitioning Multiple Properties
  4. Performance: Transformable vs Repainting Props
← Back to CSS Academy