diff --git a/packages/grafana-ui/src/themes/GlobalStyles/elements.ts b/packages/grafana-ui/src/themes/GlobalStyles/elements.ts
index e704c191b81..9646fdd3593 100644
--- a/packages/grafana-ui/src/themes/GlobalStyles/elements.ts
+++ b/packages/grafana-ui/src/themes/GlobalStyles/elements.ts
@@ -16,6 +16,10 @@ export function getElementStyles(theme: GrafanaTheme2) {
       font-kerning: normal;
     }
 
+    :root {
+      color-scheme: ${theme.colors.mode};
+    }
+
     body {
       height: 100%;
       width: 100%;
@@ -167,7 +171,7 @@ export function getElementStyles(theme: GrafanaTheme2) {
 export function getVariantStyles(variant: ThemeTypographyVariant) {
   return `
     margin: 0;
-    font-size: ${variant.fontSize};    
+    font-size: ${variant.fontSize};
     line-height: ${variant.lineHeight};
     font-weight: ${variant.fontWeight};
     letter-spacing: ${variant.letterSpacing};