diff --git a/ui/src/consts.js b/ui/src/consts.js
index e3446c2f..30731a08 100644
--- a/ui/src/consts.js
+++ b/ui/src/consts.js
@@ -7,6 +7,8 @@ export const M3U_MIME_TYPE = 'audio/x-mpegurl'
 
 export const AUTO_THEME_ID = 'AUTO_THEME_ID'
 
+export const AUTO_THEME_CONFIG_VALUE = 'Auto'
+
 export const DraggableTypes = {
   SONG: 'song',
   ALBUM: 'album',
diff --git a/ui/src/reducers/themeReducer.js b/ui/src/reducers/themeReducer.js
index 2a5d5bac..16d5fa87 100644
--- a/ui/src/reducers/themeReducer.js
+++ b/ui/src/reducers/themeReducer.js
@@ -1,8 +1,12 @@
 import { CHANGE_THEME } from '../actions'
+import { AUTO_THEME_ID, AUTO_THEME_CONFIG_VALUE } from '../consts'
 import config from '../config'
 import themes from '../themes'
 
 const defaultTheme = () => {
+  if (config.defaultTheme === AUTO_THEME_CONFIG_VALUE) {
+    return AUTO_THEME_ID
+  }
   return (
     Object.keys(themes).find(
       (t) => themes[t].themeName === config.defaultTheme,
diff --git a/ui/src/reducers/themeReducer.test.js b/ui/src/reducers/themeReducer.test.js
new file mode 100644
index 00000000..2a66ea85
--- /dev/null
+++ b/ui/src/reducers/themeReducer.test.js
@@ -0,0 +1,32 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { AUTO_THEME_ID, AUTO_THEME_CONFIG_VALUE } from '../consts'
+
+describe('themeReducer', () => {
+  beforeEach(() => {
+    vi.resetModules()
+  })
+
+  it.each([
+    {
+      configTheme: AUTO_THEME_CONFIG_VALUE,
+      expected: AUTO_THEME_ID,
+      description: 'is "Auto"',
+    },
+    { configTheme: 'Dark', expected: 'DarkTheme', description: 'is "Dark"' },
+    {
+      configTheme: 'NonExistent',
+      expected: 'DarkTheme',
+      description: 'is unrecognized',
+    },
+  ])(
+    'returns $expected when defaultTheme config $description',
+    async ({ configTheme, expected }) => {
+      vi.doMock('../config', () => ({
+        default: { defaultTheme: configTheme },
+      }))
+      const { themeReducer } = await import('./themeReducer')
+      const result = themeReducer(undefined, { type: 'UNKNOWN' })
+      expect(result).toBe(expected)
+    },
+  )
+})