Animating with the View Transitions API

The View Transitions API is the most underrated browser feature of the decade. Two CSS rules and a single line of JavaScript get you smooth, native, fully-customizable transitions between page navigations.

The trick is `view-transition-name`. Tag the elements you want to morph — a hero image, a navigation pill, a card title — with the same name on both pages. The browser does the rest: it captures, freezes, cross-fades, and reveals.

What I love about this API is that it degrades gracefully. Browsers that don't support it just navigate normally. There's no performance cost, no JS bundle, no flicker.