diff --git a/packages/theme/src/unified/UnifiedThemeProvider.tsx b/packages/theme/src/unified/UnifiedThemeProvider.tsx
index 32b0fd2708..5ae7d510fe 100644
--- a/packages/theme/src/unified/UnifiedThemeProvider.tsx
+++ b/packages/theme/src/unified/UnifiedThemeProvider.tsx
@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { ReactNode } from 'react';
+import { ReactNode, useEffect } from 'react';
 import CssBaseline from '@material-ui/core/CssBaseline';
 import {
   ThemeProvider,
@@ -70,6 +70,15 @@ export function UnifiedThemeProvider(
 
   const v4Theme = theme.getTheme('v4') as Mui4Theme;
   const v5Theme = theme.getTheme('v5') as Mui5Theme;
+  const themeMode = v4Theme ? v4Theme.palette.type : v5Theme?.palette.mode;
+
+  useEffect(() => {
+    document.body.setAttribute('data-theme-mode', themeMode);
+
+    return () => {
+      document.body.removeAttribute('data-theme-mode');
+    };
+  }, [themeMode]);
 
   let cssBaseline: JSX.Element | undefined = undefined;
   if (!noCssBaseline) {