diff --git a/packages/grafana-data/src/themes/createColors.ts b/packages/grafana-data/src/themes/createColors.ts
index da599ddec9eec..3c365ebdd969a 100644
--- a/packages/grafana-data/src/themes/createColors.ts
+++ b/packages/grafana-data/src/themes/createColors.ts
@@ -173,6 +173,7 @@ class DarkColors implements ThemeColorsBase<Partial<ThemeRichColor>> {
     icons: palette.cmDarkIcons,
     navBar: palette.cmDarkNavBar,
     text: palette.cmDarkText,
+    hover: alpha(palette.cmDarkText, 0.05),
   }
 
   contrastThreshold = 3;
@@ -262,6 +263,7 @@ class LightColors implements ThemeColorsBase<Partial<ThemeRichColor>> {
     icons: palette.cmLightIcons,
     navBar: palette.cmLightNavBar,
     text: palette.cmLightText,
+    hover: alpha(palette.cmLightText, 0.05),
   }
 
   contrastThreshold = 3;
diff --git a/public/app/core/components/AppChrome/MegaMenu/NavBarMenuItem.tsx b/public/app/core/components/AppChrome/MegaMenu/NavBarMenuItem.tsx
index 585e9f32d9292..b8d3675d593ba 100644
--- a/public/app/core/components/AppChrome/MegaMenu/NavBarMenuItem.tsx
+++ b/public/app/core/components/AppChrome/MegaMenu/NavBarMenuItem.tsx
@@ -103,7 +103,7 @@ const getStyles = (theme: GrafanaTheme2, isActive: Props['isActive'], isChild: P
     width: '100%',
     '&:hover, &:focus-visible': {
       ...(isChild && {
-        background: theme.colors.emphasize(theme.colors.background.primary, 0.03),
+        background: theme.colors.cm.hover,
       }),
       textDecoration: 'underline',
       color: theme.colors.cm.text,