Theme Toggle Studio

Theme toggles with View Transitions

Theme Toggle Studio — seven live theme-toggle effects built on the View Transitions API, tuned to taste and copied today

How to use Theme Toggle Studio

  1. Pick one of the seven effects
  2. Press the toggle and watch the page change theme
  3. Tune duration and mask origin to taste
  4. Copy the CSS and JS into your own site

Features

  • Seven effects with the repos own CSS, verbatim
  • Live demo running the real View Transitions API
  • Duration and origin controls for mask effects
  • Copy-ready CSS plus JS with the expo easing curves
  • Graceful fallback when a browser has no View Transitions API

Frequently asked questions

Is it free?

Yes, unlimited.

Login to use this free online tool. Create a free account to get started.