diff --git a/src/components/collapsible_nav/_collapsible_nav.scss b/src/components/collapsible_nav/_collapsible_nav.scss
index dc2cbaf05a..bc808d997e 100644
--- a/src/components/collapsible_nav/_collapsible_nav.scss
+++ b/src/components/collapsible_nav/_collapsible_nav.scss
@@ -14,3 +14,7 @@
 .ouiCollapsibleNav:not([class*='push']) {
   z-index: $ouiZNavigation !important; // sass-lint:disable-line no-important
 }
+
+.ouiCollapsibleNav.ouiFlyout {
+  background-color: $ouiCollapsibleNavBackgroundColor;
+}
diff --git a/src/global_styling/variables/_collapsible_nav.scss b/src/global_styling/variables/_collapsible_nav.scss
index 4b4fab10d0..2af9050dc8 100644
--- a/src/global_styling/variables/_collapsible_nav.scss
+++ b/src/global_styling/variables/_collapsible_nav.scss
@@ -10,6 +10,8 @@
  */
 
 // Should be same as OuiFlyout background color
+$ouiCollapsibleNavBackgroundColor: null !default;
+
 $ouiCollapsibleNavGroupNoneBackgroundColor: inherit !default;
 
 $ouiCollapsibleNavGroupLightBackgroundColor: $ouiPageBackgroundColor !default;
@@ -26,6 +28,8 @@ $ouiCollapsibleNavGroupDarkHighContrastColor: makeGraphicContrastColor(
 
 
 /* OUI -> EUI Aliases */
+$euiCollapsibleNavBackgroundColor: $ouiCollapsibleNavBackgroundColor;
+$euiCollapsibleNavGroupNoneBackgroundColor: $ouiCollapsibleNavGroupNoneBackgroundColor;
 $euiCollapsibleNavGroupLightBackgroundColor: $ouiCollapsibleNavGroupLightBackgroundColor;
 $euiCollapsibleNavGroupDarkBackgroundColor: $ouiCollapsibleNavGroupDarkBackgroundColor;
 $euiCollapsibleNavGroupDarkHighContrastColor: $ouiCollapsibleNavGroupDarkHighContrastColor;
diff --git a/src/themes/oui-next/global_styling/variables/_collapsible_nav.scss b/src/themes/oui-next/global_styling/variables/_collapsible_nav.scss
index b4cd021228..81fe4f3f10 100644
--- a/src/themes/oui-next/global_styling/variables/_collapsible_nav.scss
+++ b/src/themes/oui-next/global_styling/variables/_collapsible_nav.scss
@@ -9,9 +9,11 @@
  * GitHub history for details.
  */
 
+// Override OuiFlyout background
+$ouiCollapsibleNavBackgroundColor: $ouiPageBackgroundColor !default;
+
 // No distinction between none and light backgrounds in this theme
 $ouiCollapsibleNavGroupNoneBackgroundColor: $ouiPageBackgroundColor !default;
-
 $ouiCollapsibleNavGroupLightBackgroundColor: $ouiPageBackgroundColor !default;
 
 $ouiCollapsibleNavGroupDarkBackgroundColor: lightOrDarkTheme(
@@ -26,6 +28,8 @@ $ouiCollapsibleNavGroupDarkHighContrastColor: makeGraphicContrastColor(
 
 
 /* OUI -> EUI Aliases */
+$euiCollapsibleNavBackgroundColor: $ouiCollapsibleNavBackgroundColor;
+$euiCollapsibleNavGroupNoneBackgroundColor: $ouiCollapsibleNavGroupNoneBackgroundColor;
 $euiCollapsibleNavGroupLightBackgroundColor: $ouiCollapsibleNavGroupLightBackgroundColor;
 $euiCollapsibleNavGroupDarkBackgroundColor: $ouiCollapsibleNavGroupDarkBackgroundColor;
 $euiCollapsibleNavGroupDarkHighContrastColor: $ouiCollapsibleNavGroupDarkHighContrastColor;