diff --git a/src/components/desktop_nav/desktop_nav.scss b/src/components/desktop_nav/desktop_nav.scss
index 61d2541ca..0c094ce28 100644
--- a/src/components/desktop_nav/desktop_nav.scss
+++ b/src/components/desktop_nav/desktop_nav.scss
@@ -6,10 +6,6 @@
     color: var(--inputTopbarText, var(--inputText));
   }
 
-  a {
-    color: var(--link);
-  }
-
   .inner-nav {
     display: grid;
     grid-template-rows: var(--navbar-height);
@@ -91,10 +87,6 @@
     width: 2em;
     height: 100%;
     text-align: center;
-
-    .svg-inline--fa {
-      color: var(--link);
-    }
   }
 
   .sitename {
diff --git a/src/components/top_bar.style.js b/src/components/top_bar.style.js
index 20181adc0..daee80afe 100644
--- a/src/components/top_bar.style.js
+++ b/src/components/top_bar.style.js
@@ -32,6 +32,18 @@ export default {
       directives: {
         textColor: '--text'
       }
+    },
+    {
+      component: 'Icon',
+      parent: {
+        component: 'ButtonUnstyled',
+        parent: {
+          component: 'TopBar'
+        }
+      },
+      directives: {
+        textColor: '--parent--text'
+      }
     }
   ]
 }
diff --git a/src/services/color_convert/color_convert.js b/src/services/color_convert/color_convert.js
index 4d49d9cce..654f6eaa8 100644
--- a/src/services/color_convert/color_convert.js
+++ b/src/services/color_convert/color_convert.js
@@ -225,7 +225,7 @@ export const getTextColor = function (bg, text, preserve) {
 
   const originalColor = convert(text).hex
   const invertedColor = invertLightness(originalColor).hex
-  const invertedContrast = getContrastRatio(bg, invertedColor)
+  const invertedContrast = getContrastRatio(bg, convert(invertedColor).rgb)
   let workColor
 
   if (invertedContrast > originalContrast) {
@@ -238,13 +238,14 @@ export const getTextColor = function (bg, text, preserve) {
   const result = convert(rgb2hex(workColor)).hsl
   const delta = result.l > 50 ? 1 : -1
   const multiplier = 10
-  while (contrast < 4.5) {
+  while (contrast < 4.5 && result.l > 0 && result.l < 100) {
     result.l += delta * multiplier
-    contrast = getContrastRatio(bg, result)
+    contrast = getContrastRatio(bg, convert(result).rgb)
+    console.log(convert(result).hex, result.l, contrast)
   }
 
   const base = typeof text.a !== 'undefined' ? { a: text.a } : {}
-  return Object.assign(base, result)
+  return Object.assign(convert(result).rgb, base)
 }
 
 /**
diff --git a/static/palettes/index.json b/static/palettes/index.json
index 782be7a09..650d38bb5 100644
--- a/static/palettes/index.json
+++ b/static/palettes/index.json
@@ -56,6 +56,7 @@
     "bg": "#323337",
     "fg": "#1D1E21",
     "link": "#18A0E3",
+    "accent": "#6671E2",
     "text": "#DBDDE0",
     "cRed": "#E05053",
     "cBlue": "#6671E2",