diff --git a/src/js/theme.js b/src/js/theme.js
new file mode 100644
index 0000000..22aa963
--- /dev/null
+++ b/src/js/theme.js
@@ -0,0 +1,38 @@
+function toggleTheme() {
+  const theme = "theme-dark";//localStorage.getItem('theme');
+  const root = document.querySelector(":root");
+  root.classList.toggle(theme);
+  if (root.classList.contains(theme)) {
+    localStorage.setItem('theme', theme);
+  } else {
+    localStorage.setItem('theme', "theme-light");
+  }
+}
+
+function setTheme(themeName) {
+  console.log("setting theme: " + themeName);
+  const root = document.querySelector(":root");
+  root.classList.add(themeName);
+  localStorage.setItem('theme', themeName);
+}
+
+function detectTheme() {
+  const theme = localStorage.getItem('theme');
+  if (theme === 'theme-dark' || theme === 'theme-light') {
+    setTheme(theme);
+    return;
+  }
+
+  if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
+    setTheme('theme-dark');
+    return;
+  }
+
+  if (window.matchMedia('(prefers-color-scheme: light)').matches) {
+    setTheme('theme-light');
+    return;
+  }
+
+  setTheme('theme-light');
+}
+detectTheme();