ui/scss/component/_header.scss

@@ -314,7 +314,7 @@
   background-color: var(--color-header-button);
   border-radius: 1.5rem;
   margin-right: var(--spacing-s);
-  color: var(--color-brand-contrast);
+  color: var(--color-header-button-text);
   &:hover {
     .icon {
       stroke: var(--color-primary);

ui/scss/themes/dark.scss

@@ -39,6 +39,7 @@
   --color-header-button-active: var(--color-gray-6);
   --color-header-button-base: 45, 45, 45;
   --color-header-button: rgba(var(--color-header-button-base), 0.7);
+  --color-header-button-text: var(--color-white);
   --color-header-background-base: 17, 17, 17;
   --color-header-background: rgba(var(--color-header-background-base), 0.9);
   --color-header-background-transparent: rgba(7, 3, 3, 0.95);

ui/scss/themes/light.scss

@@ -44,6 +44,7 @@
 
   // Header
   --color-header-button: var(--color-button-alt-bg);
+  --color-header-button-text: var(--color-black);
   --color-header-background: #ffffff;
 
   // Button