diff --git a/app/assets/stylesheets/_consul_settings.scss b/app/assets/stylesheets/_consul_settings.scss
index 8f492c7aa..fe190497a 100644
--- a/app/assets/stylesheets/_consul_settings.scss
+++ b/app/assets/stylesheets/_consul_settings.scss
@@ -124,6 +124,7 @@ $off-screen-left: -1000rem !default;
 
 $sdg-icon-min-width: 45px !default;
 
+$sdg-text: #fff;
 $sdg-colors: (
   1: #e5243b,
   2: #dda63a,
diff --git a/app/assets/stylesheets/sdg/goals/show.scss b/app/assets/stylesheets/sdg/goals/show.scss
index 093572281..0492d0ced 100644
--- a/app/assets/stylesheets/sdg/goals/show.scss
+++ b/app/assets/stylesheets/sdg/goals/show.scss
@@ -4,7 +4,7 @@
 
     > header {
       align-items: center;
-      color: #fff;
+      color: $sdg-text;
       display: flex;
       margin: $line-height / 2 0;
       text-shadow: 0 0 1px $black;
diff --git a/app/assets/stylesheets/sdg/related_list_selector.scss b/app/assets/stylesheets/sdg/related_list_selector.scss
index 15632a19c..08f3a2438 100644
--- a/app/assets/stylesheets/sdg/related_list_selector.scss
+++ b/app/assets/stylesheets/sdg/related_list_selector.scss
@@ -6,7 +6,7 @@
   }
 
   .amsify-suggestags-area .amsify-select-tag {
-    color: $white;
+    color: $sdg-text;
 
     @each $code, $color in $sdg-colors {
       &[data-val^="#{$code}"] {
@@ -72,7 +72,7 @@
   }
 
   .remove-tag {
-    color: $white;
+    color: $sdg-text;
   }
 
   h3 {
diff --git a/app/assets/stylesheets/sdg/tag_list.scss b/app/assets/stylesheets/sdg/tag_list.scss
index 2a0018a1f..52a613382 100644
--- a/app/assets/stylesheets/sdg/tag_list.scss
+++ b/app/assets/stylesheets/sdg/tag_list.scss
@@ -13,7 +13,7 @@
 
     a:not(.more-targets),
     span {
-      color: $white;
+      color: $sdg-text;
     }
 
     @each $code, $color in $sdg-colors {