diff --git a/ui/src/audioplayer/Player.js b/ui/src/audioplayer/Player.js
index 487f3065..5751137c 100644
--- a/ui/src/audioplayer/Player.js
+++ b/ui/src/audioplayer/Player.js
@@ -5,11 +5,16 @@ import ReactJkMusicPlayer from 'react-jinke-music-player'
 import 'react-jinke-music-player/assets/index.css'
 import subsonic from '../subsonic'
 import { scrobbled, syncQueue } from './queue'
+import themes from '../themes'
 
 const Player = () => {
   const translate = useTranslate()
+  const currentTheme = useSelector((state) => state.theme)
+  const theme = themes[currentTheme] || themes.DarkTheme
+  const playerTheme = (theme.player && theme.player.theme) || 'dark'
 
   const defaultOptions = {
+    theme: playerTheme,
     bounds: 'body',
     mode: 'full',
     autoPlay: true,
diff --git a/ui/src/themes/dark.js b/ui/src/themes/dark.js
index 070d2d34..34edbd9c 100644
--- a/ui/src/themes/dark.js
+++ b/ui/src/themes/dark.js
@@ -15,5 +15,8 @@ export default {
         color: 'white'
       }
     }
+  },
+  player: {
+    theme: 'dark'
   }
 }
diff --git a/ui/src/themes/light.js b/ui/src/themes/light.js
index c8f6027f..d176a320 100644
--- a/ui/src/themes/light.js
+++ b/ui/src/themes/light.js
@@ -3,8 +3,8 @@ export default {
   palette: {
     secondary: {
       light: '#5f5fc4',
-      main: '#283593',
       dark: '#001064',
+      main: '#283593',
       contrastText: '#fff'
     }
   },
@@ -17,5 +17,8 @@ export default {
         }
       }
     }
+  },
+  player: {
+    theme: 'light'
   }
 }