::view-transition-image-pair | CSS Selectors & Pseudo-classes

Targets the 'pair' of images (the old snapshot and the new snapshot) within a view transition group. This is where the cross-fade between the two states actually happens.

Quick example

::view-transition-image-pair(hero-image) {
  /* Ensures the cross-fade is perfectly smooth without any background leaking through */
  isolation: isolate;
}

::view-transition-image-pair Browser Support

Newly available Since 2025 91% global usage

Since 2025 this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Works in all modern browsers. May need a fallback for older browsers.

View on caniuse.com → View on MDN → View on webstatus.dev → View spec → Learn more about Baseline →

109+

144+

18+

109+