diff --git a/ui/src/audioplayer/PlayerToolbar.js b/ui/src/audioplayer/PlayerToolbar.js
index 1800a34b1..223dbf936 100644
--- a/ui/src/audioplayer/PlayerToolbar.js
+++ b/ui/src/audioplayer/PlayerToolbar.js
@@ -4,11 +4,15 @@ import { useGetOne } from 'react-admin'
 import { GlobalHotKeys } from 'react-hotkeys'
 import { LoveButton, useToggleLove } from '../common'
 import { keyMap } from '../hotkeys'
+import { ThemeProvider } from '@material-ui/styles'
+import { createMuiTheme } from '@material-ui/core/styles'
+import useCurrentTheme from '../themes/useCurrentTheme'
 
 const Placeholder = () => <LoveButton disabled={true} resource={'song'} />
 
 const Toolbar = ({ id }) => {
   const location = useLocation()
+  const theme = useCurrentTheme()
   const resource = location.pathname.startsWith('/song') ? 'song' : 'albumSong'
   const { data, loading } = useGetOne(resource, id)
   const [toggleLove, toggling] = useToggleLove(resource, data)
@@ -18,14 +22,14 @@ const Toolbar = ({ id }) => {
   }
 
   return (
-    <>
+    <ThemeProvider theme={createMuiTheme(theme)}>
       <GlobalHotKeys keyMap={keyMap} handlers={handlers} allowChanges />
       <LoveButton
         record={data}
         resource={resource}
         disabled={loading || toggling}
       />
-    </>
+    </ThemeProvider>
   )
 }