transition-property

Specifies which CSS properties should be animated during a transition. You can list specific properties like 'transform' or 'opacity' to ensure you aren't accidentally animating things that might hurt performance.

.box {
  background-color: white;
  border: 1px solid grey;
  /* Only animate the background, keep the border change instant */
  transition-property: background-color;
  transition-duration: 0.5s;
}
Initial value
all
Inherited
No
Applies to
allElementsAndPseudos
Animation type
notAnimatable

Values

none
Widely available Since 2015 96% global usage

This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.

Safe to use without fallbacks.

26+
16+
9+
12+
ESC