diff --git a/src/client/theme-default/components/VPSwitchAppearance.vue b/src/client/theme-default/components/VPSwitchAppearance.vue
index e23329a84c65..9613f1eb83da 100644
--- a/src/client/theme-default/components/VPSwitchAppearance.vue
+++ b/src/client/theme-default/components/VPSwitchAppearance.vue
@@ -18,13 +18,13 @@ function useAppearance() {
   const query = window.matchMedia('(prefers-color-scheme: dark)')
   const classList = document.documentElement.classList
 
-  let userPreference =
-    localStorage.getItem(APPEARANCE_KEY) || site.value.appearance !== true
-      ? site.value.appearance
-      : 'auto'
+  let userPreference = localStorage.getItem(APPEARANCE_KEY)
 
   let isDark =
-    userPreference === 'auto' ? query.matches : userPreference === 'dark'
+    (site.value.appearance === 'dark' && userPreference == null) ||
+    (userPreference === 'auto' || userPreference == null
+      ? query.matches
+      : userPreference === 'dark')
 
   query.onchange = (e) => {
     if (userPreference === 'auto') {