diff --git a/src/amo/components/SectionLinks/styles.scss b/src/amo/components/SectionLinks/styles.scss
index 2b5ca59c8b9..2add4d69e4d 100644
--- a/src/amo/components/SectionLinks/styles.scss
+++ b/src/amo/components/SectionLinks/styles.scss
@@ -16,7 +16,7 @@
 
 .SectionLinks-link,
 .SectionLinks-link:link {
-  color: transparentize($white, 0.5);
+  color: $header-text-not-active-color;
   margin: 0 15px;
   padding: 0 0 2px;
   text-decoration: none;
@@ -25,7 +25,7 @@
 
   &:focus,
   &:hover {
-    border-bottom: 3px solid transparentize($white, 0.5);
+    border-bottom: 3px solid $header-text-not-active-color;
   }
 
   &:active {
diff --git a/src/ui/components/SearchInput/style.scss b/src/ui/components/SearchInput/style.scss
index 289b4928d06..e52523ae318 100644
--- a/src/ui/components/SearchInput/style.scss
+++ b/src/ui/components/SearchInput/style.scss
@@ -1,5 +1,6 @@
 @import "~core/css/inc/mixins";
 @import "~ui/components/Icon/vars";
+@import "~ui/css/vars";
 
 $input-height: 48px;
 $icon-margin-start: 24px;
@@ -47,6 +48,7 @@ $icon-margin-end: 12px;
   // Include the start margin on the end so that icon and text is centred together.
   @include padding-end($icon-margin-start);
 
+  color: $header-text-not-active-color;
   display: inline-block;
   height: $input-height;
   line-height: $input-height;
diff --git a/src/ui/css/vars.scss b/src/ui/css/vars.scss
index a366735a183..5533154adaa 100644
--- a/src/ui/css/vars.scss
+++ b/src/ui/css/vars.scss
@@ -43,6 +43,7 @@ $type-black: $black;
 $link-color: #0d96ff;
 
 $header-accent-color: $link-color;
+$header-text-not-active-color: transparentize($white, 0.5);
 
 // Fonts
 $font-size-s: 12px;