diff --git a/app/styles/components/sidebar-menu.scss b/app/styles/components/sidebar-menu.scss
index c9391ddd0..3475f6ce0 100644
--- a/app/styles/components/sidebar-menu.scss
+++ b/app/styles/components/sidebar-menu.scss
@@ -7,7 +7,7 @@
   top: 0;
   bottom: 0;
   left: 0;
-  background-color: #fff;
+  background-color: var(--background-color);
   transform: translateX(-275px);
   transition: all 0.15s linear;
   z-index: 10001;
@@ -42,7 +42,7 @@
     display: flex;
     flex-direction: column;
     padding: 4px 0;
-    border-top: 1px solid var(--brand-color-med);
+    border-top: 1px solid rgba(var(--primary-text-color-rgb), 0.15);
 
     &--borderless {
       margin: 0;
@@ -71,7 +71,7 @@
   display: flex;
   height: 46px;
   padding: 12px 14px;
-  border-bottom: 1px solid #ddd;
+  border-bottom: 1px solid rgba(var(--primary-text-color-rgb), 0.15);
   box-sizing: border-box;
   align-items: center;
 
@@ -107,6 +107,7 @@
     .display-name__account {
       display: block;
       margin-top: 2px;
+      color: var(--primary-text-color-faint);
     }
   }
 
@@ -134,7 +135,7 @@
 
   &__label {
     display: flex;
-    color: var(--primary-text-color);
+    color: var(--primary-text-color-faint);
   }
 
   &:hover {
@@ -147,16 +148,13 @@
   padding: 16px 18px;
   cursor: pointer;
   text-decoration: none;
-  color: var(--primary-text-color);
+  color: var(--primary-text-color-faint);
   font-size: 15px;
   font-weight: 400;
 
   &:hover {
     background-color: rgba(var(--brand-color-rgb), 0.1);
-
-    .fa {
-      color: var(--primary-text-color);
-    }
+    color: var(--primary-text-color);
   }
 
   .fa {