diff --git a/ui/src/components/menu/SideMenu.vue b/ui/src/components/menu/SideMenu.vue
index 20c76daddab..c670c9f3bff 100644
--- a/ui/src/components/menu/SideMenu.vue
+++ b/ui/src/components/menu/SideMenu.vue
@@ -110,7 +110,6 @@ export default {
   }
 
   &.light {
-    background-color: #fff;
     box-shadow: 2px 0px 8px 0px rgba(29, 35, 41, 0.05);
 
     .ant-menu-light {
diff --git a/ui/src/style/vars.less b/ui/src/style/vars.less
index 399afd6b94c..b422e538aea 100644
--- a/ui/src/style/vars.less
+++ b/ui/src/style/vars.less
@@ -89,6 +89,10 @@ a {
   box-shadow: 1px 1px 0px 0px #e8e8e8;
 }
 
+.sider.light {
+  background: @navigation-background-color;
+}
+
 .ant-menu {
   background: @navigation-background-color;
 }