diff --git a/src/app/app.component.html b/src/app/app.component.html
index 3c70d48f9c..903cc1c43b 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,6 +1,6 @@
 <ng-container *ngIf="(isAllDataLoadedInitially$|async)">
   <main-header></main-header>
-  <bookmark-bar class="bgc-800"></bookmark-bar>
+  <bookmark-bar></bookmark-bar>
   <!--TODO move inside page container somehow -->
   <banner></banner>
   <add-task-bar (blurred)="layoutService.hideAddTaskBar()"
diff --git a/src/app/features/bookmark/bookmark-bar/bookmark-bar.component.scss b/src/app/features/bookmark/bookmark-bar/bookmark-bar.component.scss
index 12fa197361..6a3a45f40e 100644
--- a/src/app/features/bookmark/bookmark-bar/bookmark-bar.component.scss
+++ b/src/app/features/bookmark/bookmark-bar/bookmark-bar.component.scss
@@ -7,9 +7,10 @@ $listControlsWidth: 36px;
 $bookmarkMinWidth: 56px;
 
 :host {
-
+  @include mat-css-color-and-contrast(700);
 }
 
+
 .global-bookmark-list-outer {
   padding-bottom: $sTopBottom;
   box-shadow: $whiteframe-shadow-3dp;