diff --git a/src/layout/components/Settings/index.vue b/src/layout/components/Settings/index.vue
index 745adda..6fd3763 100644
--- a/src/layout/components/Settings/index.vue
+++ b/src/layout/components/Settings/index.vue
@@ -81,7 +81,12 @@ onMounted(() => {
   window.document.body.setAttribute("layout", settingsStore.layout);
   const theme =
     localStorage.getItem("vueuse-color-scheme") || defaultSettings.theme;
-  localStorage.setItem("vueuse-color-scheme", theme);
+  settingsStore.changeSetting({ key: "theme", value: theme });
+
+  if (theme != "light") {
+    document.documentElement.classList.add("dark");
+  }
+
   document.documentElement.style.setProperty(
     "--el-color-primary",
     settingsStore.themeColor
diff --git a/src/store/modules/settings.ts b/src/store/modules/settings.ts
index ad58399..6689823 100644
--- a/src/store/modules/settings.ts
+++ b/src/store/modules/settings.ts
@@ -45,6 +45,9 @@ export const useSettingsStore = defineStore("setting", () => {
       case "themeColor":
         themeColor.value = value;
         break;
+      case "theme":
+        theme.value = value;
+        break;
     }
   }
 
@@ -56,5 +59,6 @@ export const useSettingsStore = defineStore("setting", () => {
     layout,
     themeColor,
     changeSetting,
+    theme,
   };
 });