diff --git a/src/assets/vars.scss b/src/assets/vars.scss
index dc9fd696f..60feaca49 100644
--- a/src/assets/vars.scss
+++ b/src/assets/vars.scss
@@ -15,7 +15,7 @@ $highlight-white: #e7faec;
     --background-4: #d0d3d5;
     --background-ternary: #8e8e8e;
     --background-sidebar-active: #e4e4e4;
-    --background-navbar: #8e8e8e;
+    --background-navbar: #FFF;
     --main-font-color: #212529;
 }
 
diff --git a/src/layouts/Layout.vue b/src/layouts/Layout.vue
index 3468d0af3..c419fce05 100644
--- a/src/layouts/Layout.vue
+++ b/src/layouts/Layout.vue
@@ -113,7 +113,7 @@ export default {
     height: 60px;
     width: 100%;
     left: 0;
-    background-color: #fff;
+    background-color: var(--background-navbar);
     box-shadow: 0 15px 47px 0 rgba(0, 0, 0, 0.05), 0 5px 14px 0 rgba(0, 0, 0, 0.05);
     text-align: center;
     white-space: nowrap;