diff --git a/web/html/xui/component/themeSwitch.html b/web/html/xui/component/themeSwitch.html
index 9ca080d9..f09b9be2 100644
--- a/web/html/xui/component/themeSwitch.html
+++ b/web/html/xui/component/themeSwitch.html
@@ -38,4 +38,23 @@
     }
   });
 </script>
-{{end}}
\ No newline at end of file
+{{end}}
+
+{{define "component/ultraDarkTheme"}}
+<script>
+  const uthemeToggle = document.getElementById('ultra-dark-theme');
+  const isUltraDarkThemeEnabled = localStorage.getItem('isUltraDarkThemeEnabled') === 'true';
+  uthemeToggle.checked = isUltraDarkThemeEnabled;
+  function ultraToggleTheme() {
+      if (uthemeToggle.checked) {
+          document.documentElement.setAttribute('data-theme', 'ultra-dark');
+          localStorage.setItem('isUltraDarkThemeEnabled', 'true');
+      } else {
+          document.documentElement.removeAttribute('data-theme');
+          localStorage.setItem('isUltraDarkThemeEnabled', 'false');
+      }
+  }
+  uthemeToggle.addEventListener('change', ultraToggleTheme);
+  ultraToggleTheme();
+  </script>
+{{end}}