diff --git a/frontend/src/darkmode.rs b/frontend/src/darkmode.rs
new file mode 100644
index 0000000..c6ba7f6
--- /dev/null
+++ b/frontend/src/darkmode.rs
@@ -0,0 +1,24 @@
+use yew::prelude::*;
+
+#[function_component]
+pub fn ThemeToggle() -> Html {
+    let onclick = {
+        Callback::from(|_| {
+            if let Some(window) = web_sys::window() {
+                if let Some(document) = window.document() {
+                    if let Some(html) = document.document_element() {
+                        let current = html.get_attribute("data-theme").unwrap_or_default();
+                        let new_theme = if current == "dark" { "" } else { "dark" };
+                        let _ = html.set_attribute("data-theme", new_theme);
+                    }
+                }
+            }
+        })
+    };
+
+    html! {
+        <button {onclick} class="sidebar-button">
+            {"🌙"}
+        </button>
+    }
+}
diff --git a/frontend/src/lib.rs b/frontend/src/lib.rs
index f1a4bcb..92fd282 100644
--- a/frontend/src/lib.rs
+++ b/frontend/src/lib.rs
@@ -1,4 +1,5 @@
 mod auth;
+mod darkmode;
 mod pages;
 use crate::auth::ProtectedRoute;
 use crate::pages::*;