diff --git a/src/app/config.ts b/src/app/config.ts
index 30f1573afb..ce45a84822 100644
--- a/src/app/config.ts
+++ b/src/app/config.ts
@@ -30,6 +30,7 @@ export default {
     'vi-VN': 'Vietnamese',
   },
   query_history_depth: isElectron ? 50 : 7,
+  defaultTheme: 'matchMedia' in window && window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light',
   themes: ['light', 'dark'],
   isTranslateMode,
   isWebApp: window['__ALTAIR_WEB_APP__'],
diff --git a/src/app/reducers/settings/settings.ts b/src/app/reducers/settings/settings.ts
index a3012bb6bf..d47dc60866 100644
--- a/src/app/reducers/settings/settings.ts
+++ b/src/app/reducers/settings/settings.ts
@@ -71,7 +71,7 @@ export interface State {
 }
 
 const initialState: State = {
-  theme: 'light',
+  theme: <SettingsTheme>config.defaultTheme,
   language: <SettingsLanguage>config.default_language,
   addQueryDepthLimit: config.add_query_depth_limit,
   tabSize: config.tab_size,