diff --git a/src/renderer/src/assets/images/providers/dmxapi-logo-dark.webp b/src/renderer/src/assets/images/providers/dmxapi-logo-dark.webp
new file mode 100644
index 0000000000..baad605a00
Binary files /dev/null and b/src/renderer/src/assets/images/providers/dmxapi-logo-dark.webp differ
diff --git a/src/renderer/src/pages/settings/ProviderSettings/DMXAPISettings.tsx b/src/renderer/src/pages/settings/ProviderSettings/DMXAPISettings.tsx
index a99ae259b7..b9d54fd8b9 100644
--- a/src/renderer/src/pages/settings/ProviderSettings/DMXAPISettings.tsx
+++ b/src/renderer/src/pages/settings/ProviderSettings/DMXAPISettings.tsx
@@ -1,4 +1,6 @@
 import DmxapiLogo from '@renderer/assets/images/providers/dmxapi-logo.webp'
+import DmxapiLogoDark from '@renderer/assets/images/providers/dmxapi-logo-dark.webp'
+import { useTheme } from '@renderer/context/ThemeProvider'
 import { useProvider } from '@renderer/hooks/useProvider'
 import { Provider } from '@renderer/types'
 import { Radio, RadioChangeEvent, Space } from 'antd'
@@ -40,6 +42,7 @@ const PlatformOptions = [
 
 const DMXAPISettings: FC<DMXAPISettingsProps> = ({ provider: initialProvider }) => {
   const { provider, updateProvider } = useProvider(initialProvider.id)
+  const { theme } = useTheme()
 
   const { t } = useTranslation()
 
@@ -71,7 +74,7 @@ const DMXAPISettings: FC<DMXAPISettingsProps> = ({ provider: initialProvider })
     <Container>
       <Space direction="vertical" style={{ width: '100%' }}>
         <LogoContainer>
-          <Logo src={DmxapiLogo}></Logo>
+          <Logo src={theme === 'dark' ? DmxapiLogoDark : DmxapiLogo}></Logo>
         </LogoContainer>
 
         <SettingSubtitle style={{ marginTop: 5 }}>{t('settings.provider.dmxapi.select_platform')}</SettingSubtitle>