diff --git a/lib/aprsme_web/components/layouts/root.html.heex b/lib/aprsme_web/components/layouts/root.html.heex
index 27bafec..e50950c 100644
--- a/lib/aprsme_web/components/layouts/root.html.heex
+++ b/lib/aprsme_web/components/layouts/root.html.heex
@@ -4,6 +4,24 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="csrf-token" content={get_csrf_token()} />
+    <script>
+      (function() {
+        try {
+          var theme = (typeof localStorage !== 'undefined' && localStorage.getItem('theme')) || 'auto';
+          if(theme === 'auto') {
+            if(window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+              document.documentElement.setAttribute('data-theme', 'dark');
+            } else {
+              document.documentElement.setAttribute('data-theme', 'light');
+            }
+          } else {
+            document.documentElement.setAttribute('data-theme', theme);
+          }
+        } catch(e) {
+          document.documentElement.setAttribute('data-theme', 'light');
+        }
+      })();
+    </script>
     <.live_title suffix=" · aprs.me">
       {assigns[:page_title] || "Aprs"}
     </.live_title>