diff --git a/web/src/routes/+layout.svelte b/web/src/routes/+layout.svelte
index 6768e75e..ceb01fe9 100644
--- a/web/src/routes/+layout.svelte
+++ b/web/src/routes/+layout.svelte
@@ -1,6 +1,13 @@
 <script lang="ts">
     import "../styles/main.css";
-    import NavMenu from "$lib/components/NavMenu.svelte";
+    import {onMount} from "svelte";
+    import { browser } from "$app/environment";
+
+    onMount(() => {
+        if (browser) {
+            window.document.documentElement.classList.add('dark')
+        }
+    })
 </script>
 
 <div class="grid h-full w-screen grid-cols-1 grid-rows-[1fr] overflow-hidden text-smd dark:text-gray-300">
diff --git a/web/tailwind.config.js b/web/tailwind.config.js
index d6932699..0bb44967 100644
--- a/web/tailwind.config.js
+++ b/web/tailwind.config.js
@@ -1,5 +1,6 @@
 /** @type {import('tailwindcss').Config} */
 export default {
+  darkMode: 'class',
   content: ['./src/**/*.{html,js,svelte,ts}'],
   theme: {
     extend: {