diff --git a/src/components/forms/input.css b/src/components/forms/input.css
index bd69596368e4aca073dac10f8c19c1a588197825..6d5eefa52d5b2f4d5c0c558fb37aa1f05ad5e7c0 100644
--- a/src/components/forms/input.css
+++ b/src/components/forms/input.css
@@ -8,6 +8,7 @@
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     font-size: 0.625rem;
     font-weight: bold;
+    color: $text-primary;
 
     border-width: 1px;
     border-style: solid;
diff --git a/src/components/library-item/library-item.css b/src/components/library-item/library-item.css
index 12253a55202602010b71b2a98014d1ecbbe787df..067b2c1af3328a80dd5e228d810d6129f1788617 100644
--- a/src/components/library-item/library-item.css
+++ b/src/components/library-item/library-item.css
@@ -1,3 +1,4 @@
+@import "../../css/colors.css";
 @import "../../css/units.css";
 
 .library-item {
@@ -11,7 +12,7 @@
     margin: $space;
     padding: 1rem 1rem 0 1rem;
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-    color: #575e75;
+    color: $text-primary;
     background: white;
     border-width: 2px;
     border-style: solid;
diff --git a/src/components/sound-editor/sound-editor.css b/src/components/sound-editor/sound-editor.css
index 0af2f011dd9f95149f0aa462365110388e9be4bd..257c59d655357a096638cc18c6ac6b4dbde5a3b6 100644
--- a/src/components/sound-editor/sound-editor.css
+++ b/src/components/sound-editor/sound-editor.css
@@ -78,7 +78,7 @@ $border-radius: 0.25rem;
 
 .effect-button {
     flex-basis: 150px;
-    color: #575e75; /* @todo discuss the multiple font colors with Carl, move to variable */
+    color: $text-primary;
 }
 
 .effect-button + .effect-button {
diff --git a/src/components/sprite-info/sprite-info.css b/src/components/sprite-info/sprite-info.css
index 27f243dbc022259746f37411acc52b65d3e1d72e..200aedaf79f13627abf74a4c9378ccb0f60eb300 100644
--- a/src/components/sprite-info/sprite-info.css
+++ b/src/components/sprite-info/sprite-info.css
@@ -6,7 +6,7 @@
     padding: 0.75rem;
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     background-color: white;
-    color: #575e75;
+    color: $text-primary;
     border-top-left-radius: $space;
     border-top-right-radius: $space;
     border-bottom: 1px solid #eaeaea;
diff --git a/src/components/stage-selector/stage-selector.css b/src/components/stage-selector/stage-selector.css
index 9d314962507661121f6241adfb05bb90217a0ad4..450580930e5705518512a786668ac44afb8f7fda 100644
--- a/src/components/stage-selector/stage-selector.css
+++ b/src/components/stage-selector/stage-selector.css
@@ -11,7 +11,7 @@ $header-height: calc($stage-menu-height - 2px);
     flex-grow: 1;
     font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
     background-color: #f9f9f9;
-    color: #575e75;
+    color: $text-primary;
     border-top-left-radius: $space;
     border-top-right-radius: $space;
     border-color: #dbdbdb;
@@ -34,7 +34,7 @@ $header-height: calc($stage-menu-height - 2px);
     justify-content: center;
     height: $header-height;
     background-color: white;
-    color: #575e75;
+    color: $text-primary;
     border-top-left-radius: $space;
     border-top-right-radius: $space;
     border-bottom: 1px solid #eaeaea;
@@ -44,7 +44,7 @@ $header-height: calc($stage-menu-height - 2px);
 .header-title {
     font-size: 0.625rem;
     font-weight: bold;
-    color: #575e75;
+    color: $text-primary;
 
     /* @todo: make this a mixin for all UI text labels */
     user-select: none;
@@ -53,7 +53,7 @@ $header-height: calc($stage-menu-height - 2px);
 .count {
     padding: 0.3rem 0.75rem;
     font-size: 0.625rem;
-    color: #575e75;
+    color: $text-primary;
     background: white;
     border: 1px solid #eaeaea;
     border-radius: 0.25rem;
@@ -63,7 +63,7 @@ $header-height: calc($stage-menu-height - 2px);
 .label {
     margin: 0.75rem 0 0.25rem;
     font-size: 0.6rem;
-    color: #575e75;
+    color: $text-primary;
     user-select: none;
 }
 
diff --git a/src/css/colors.css b/src/css/colors.css
index bde9f339f6a13757709053e99d263be81c73414e..d1dd5690ea2857bf226f31ad63b22576c163d16c 100644
--- a/src/css/colors.css
+++ b/src/css/colors.css
@@ -2,6 +2,8 @@ $ui-pane-border: #D9D9D9;
 $ui-pane-gray: #F9F9F9;
 $ui-background-blue: #e8edf1;
 
+$text-primary: #575e75;
+
 $motion-primary: #4C97FF;
 $motion-tertiary: #3373CC;
 $motion-transparent: rgba(76, 151, 255, 0.25);