ViewTransition Playground
This playground demonstrates Flyva's native View Transition API support. Navigate using the links above to see different VT modes in action.
Demo transitions
VT + CSS Fade
cssMode: true with viewTransitionNames. CSS ::view-transition-* rules handle the crossfade. Used on Home → About navigation.
VT + CSS Shared Element
Dynamic viewTransitionNames per card. The clicked work card morphs into the detail hero via CSS VT. Navigate to Work and click a project.
VT + JS Slide
animateViewTransition using WAAPI to slide::view-transition-old left and::view-transition-new in from the right. Used on Work link.