The CSS view transitions module defines the behavior of the View Transition API, which allows developers to create animated transitions between different states within a document and across documents. This module also defines the CSS properties and pseudo-elements for styling these transitions.

Reference

Properties

• view-transition-class
• view-transition-name

At-rules and descriptors

• @view-transition
  • navigation descriptor

Selectors and pseudo-elements

• :active-view-transition
• :active-view-transition-type()
• ::view-transition
• ::view-transition-image-pair()
• ::view-transition-group()
• ::view-transition-new()
• ::view-transition-old()

Interfaces

• CSSViewTransitionRule
• ViewTransition
  • ViewTransition.skipTransition() method
  • ViewTransition.updateCallbackDone
  • ViewTransition.ready
  • ViewTransition.finished
• Document.startViewTransition() method

Guides

• Using the View Transition API
  • Explains how to create view transitions and customize transition animations, including manipulating active view transitions.

Related concepts

• pagereveal event

• pageswap event

• Document.visibilityState

• CSS animations module

  • animation
  • @keyframes
  • CSSKeyframesRule
  • CSSStyleRule
  • Web animations API

• CSS transforms module

  • transform
  • transform-function

Specifications

See also

• Pseudo-elements
• Functional pseudo-classes
• Learn: Pseudo-classes and pseudo-elements