diff --git a/input.css b/input.css
index bd6213e..d3c3dc5 100644
--- a/input.css
+++ b/input.css
@@ -1,3 +1,6 @@
 @tailwind base;
 @tailwind components;
-@tailwind utilities;
\ No newline at end of file
+@tailwind utilities;
+
+@custom-variant dark (&:where(.dark, .dark *));
+
diff --git a/src/layout/mod.rs b/src/layout/mod.rs
index 66daaec..52ab441 100644
--- a/src/layout/mod.rs
+++ b/src/layout/mod.rs
@@ -10,7 +10,7 @@ use header::Header;
 pub fn Layout() -> Element {
     rsx! {
         div {
-            class: "flex flex-col min-h-screen",
+            class: "dark flex flex-col min-h-screen",
             Header {},
             Body {
                 Outlet::<Route> {},