diff --git a/src/palettes/changeTheme/index.js b/src/palettes/changeTheme/index.js
index b76e88f1d..c4c5d25b2 100644
--- a/src/palettes/changeTheme/index.js
+++ b/src/palettes/changeTheme/index.js
@@ -2,11 +2,12 @@ import "./style.scss";
 import palette from "components/palette";
 import config from "lib/config";
 import appSettings from "lib/settings";
-import { isDeviceDarkTheme } from "lib/systemConfiguration";
 import themes from "theme/list";
 import { updateSystemTheme } from "theme/preInstalled";
 import changeEditorTheme from "../changeEditorTheme";
 
+const darkModeMediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+
 export default function changeTheme(type = "editor") {
 	if (type === "editor") return changeEditorTheme();
 	palette(
@@ -41,30 +42,18 @@ function generateHints(type) {
 	});
 }
 
-let previousDark = isDeviceDarkTheme();
-const updateTimeMs = 2000;
-
-let intervalId = null;
-
-function syncSystemTheme() {
-	if (appSettings.value.appTheme.toLowerCase() === "system") {
-		const isDark = isDeviceDarkTheme();
-		if (isDark !== previousDark) {
-			previousDark = isDark;
-			updateSystemTheme(isDark);
-		}
-	}
+function syncSystemTheme(event) {
+	if (appSettings.value.appTheme.toLowerCase() !== "system") return;
+	const isDark = event ? event.matches : darkModeMediaQuery.matches;
+	updateSystemTheme(isDark);
 }
 
 function startSystemThemeWatcher() {
-	if (intervalId) return;
-	intervalId = setInterval(syncSystemTheme, updateTimeMs);
+	darkModeMediaQuery.addEventListener("change", syncSystemTheme);
 }
 
 function stopSystemThemeWatcher() {
-	if (!intervalId) return;
-	clearInterval(intervalId);
-	intervalId = null;
+	darkModeMediaQuery.removeEventListener("change", syncSystemTheme);
 }
 
 function updateSystemThemeWatcher(theme) {
diff --git a/src/theme/preInstalled.js b/src/theme/preInstalled.js
index 6e3165744..8eb266e96 100644
--- a/src/theme/preInstalled.js
+++ b/src/theme/preInstalled.js
@@ -280,6 +280,7 @@ export function updateSystemTheme(darkTheme) {
 
 	if (appSettings?.value?.appTheme === "system") {
 		apply(system.id);
+		appSettings.update({ editorTheme: system.preferredEditorTheme }, false);
 	}
 }