diff --git a/src/components/left/main/LeftSideMenuItems.tsx b/src/components/left/main/LeftSideMenuItems.tsx
index c56734843..fbf6fc9e4 100644
--- a/src/components/left/main/LeftSideMenuItems.tsx
+++ b/src/components/left/main/LeftSideMenuItems.tsx
@@ -29,6 +29,7 @@ import { IS_MULTIACCOUNT_SUPPORTED } from '../../../util/browser/globalEnvironme
 import { IS_TAURI } from '../../../util/browser/globalEnvironment';
 import { getPromptInstall } from '../../../util/installPrompt';
 import { switchPermanentWebVersion } from '../../../util/permanentWebVersion';
+import { getSystemTheme } from '../../../util/systemTheme';
 
 import { useFolderManagerForUnreadCounters } from '../../../hooks/useFolderManager';
 import useLang from '../../../hooks/useLang';
@@ -106,9 +107,10 @@ const LeftSideMenuItems = ({
   const handleDarkModeToggle = useLastCallback((e: React.SyntheticEvent<HTMLElement>) => {
     e.stopPropagation();
     const newTheme = theme === 'light' ? 'dark' : 'light';
+    const shouldUseSystemTheme = newTheme === getSystemTheme();
 
     setSharedSettingOption({ theme: newTheme });
-    setSharedSettingOption({ shouldUseSystemTheme: false });
+    setSharedSettingOption({ shouldUseSystemTheme });
   });
 
   const handleAnimationLevelChange = useLastCallback((e: React.SyntheticEvent<HTMLElement>) => {