diff --git a/static/demos/light-dark-demo-4/index.html b/static/demos/light-dark-demo-4/index.html
index 49c76db..e96865e 100644
--- a/static/demos/light-dark-demo-4/index.html
+++ b/static/demos/light-dark-demo-4/index.html
@@ -78,8 +78,7 @@
         }
     </style>
     <script type="module">
-        function toggleTheme(e) {
-            e.preventDefault();
+        function toggleTheme_() {
             fetch('./light-dark-toggle?ref=https%3A%2F%2Fpagwin.xyz%2Fstatic%2Fdemos%2Flight-dark-demo-4%2F')
             if (!document.body.classList.contains("toggled")) {
                 document.body.classList.add("toggled")
@@ -88,6 +87,15 @@
                 document.body.classList.remove("toggled")
             }
         }
+        function toggleTheme(e) {
+            e.preventDefault();
+            if (document.startViewTransition) {
+                document.startViewTransition(toggleTheme_);
+            }
+            else {
+                toggleTheme_();
+            }
+        }
         window.addEventListener("load", () => {
             document
                 .getElementById("full-demo")