Cross-Document View Transitions (MPA)

This example uses @view-transition { navigation: auto } in CSS to enable transitions between full page navigations. No JavaScript required — just regular links and CSS.

How it works: These are regular <a> links, not React Router or Next.js client-side navigation. The browser handles the transition automatically because of the @view-transition CSS rule. Shared view-transition-name values create morphing effects between pages.