Fun with View Transitions

Use these exercises as an interactive playground to deepen your understanding of the View Transitions API! Visit the single episodes at vtbag.dev!

Ladies and Gentlemen, Start Your Engines!

1. Enabling

Check and Control the Image Animations!

2. Customizing

Make Your Images Glide Across the Screen!

3. Morphing

On a Trip to the Text Morphology Clinic!

4. Healing

Add View Transitions to Your Starlight Site!

5. Twinkling

Gone Without a Trace: Missing Mobile Animations!

6. Uncovering

Transition the Disks from Peg to Peg!

7. Playing

These exercises are available as a GitHub repository at https://github.com/vtbag/fun-with-view-transitions

Find the examples for the episodes in the /episodes/ folder. Edit the view-transition.css file to customize the view transitions. There is also a view-transition-solution.css file if you got stuck.