diff --git a/client/modules/About/About.styles.ts b/client/modules/About/About.styles.ts
index 0714e39608..62e58ebbf1 100644
--- a/client/modules/About/About.styles.ts
+++ b/client/modules/About/About.styles.ts
@@ -177,7 +177,7 @@ export const ContactHandles = styled.p`
   width: 50%;
 
   & a {
-    color: ${prop('logoColor')};
+    color: ${prop('linkTextColor')};
     text-decoration: underline;
 
     &:hover {
@@ -204,7 +204,7 @@ export const Footer = styled.div`
 
   & a {
     margin: ${remSize(20)} 9.5% 0 0;
-    color: ${prop('logoColor')};
+    color: ${prop('linkTextColor')};
     text-decoration: underline;
 
     &:hover {
diff --git a/client/styles/abstracts/_placeholders.scss b/client/styles/abstracts/_placeholders.scss
index 2cb9230d7d..da8592b145 100644
--- a/client/styles/abstracts/_placeholders.scss
+++ b/client/styles/abstracts/_placeholders.scss
@@ -173,10 +173,10 @@
 %link {
 	@include themify() {
 		text-decoration: none;
-		color: getThemifyVariable('inactive-text-color');
+		color: getThemifyVariable('link-text-color');
 		cursor: pointer;
 		& g, & path {
-			fill: getThemifyVariable('inactive-text-color');
+			fill: getThemifyVariable('link-text-color');
 		}
 		&:hover {
 			text-decoration: none;
diff --git a/client/styles/abstracts/_variables.scss b/client/styles/abstracts/_variables.scss
index b1eebc3011..ef53d6ade6 100644
--- a/client/styles/abstracts/_variables.scss
+++ b/client/styles/abstracts/_variables.scss
@@ -8,7 +8,8 @@ $white: #fff;
 $black: #000;
 $yellow: #F5DC23;
 $dodgerblue: #1E90FF;
-$p5-contrast-pink: #FFA9D9;
+$p5-contrast-light-pink: #ffa9d9;
+$p5-contrast-dark-pink: #b20046;
 
 $outline-color: #0F9DD7;
 
@@ -31,8 +32,9 @@ $darkest: #000;
 
 $themes: (
   light: (
+    link-text-color: $p5-contrast-dark-pink,
     admonition-background: #E4F8FF,
-    admonition-border: #22C8ED,
+    admonition-border: #22C8ED, 
     admonition-text: #075769,
     background-color: $lighter,
     button-active-color: $lightest,
@@ -129,6 +131,7 @@ $themes: (
     toolbar-button-color: $dark,
   ),
   dark: (
+    link-text-color: $p5-contrast-light-pink,
     admonition-background: #105A7F,
     admonition-border: #22C8ED,
     admonition-text: #FFFFFF,
@@ -226,6 +229,7 @@ $themes: (
     toolbar-button-color: $lightest,
   ),
   contrast: (
+    link-text-color: $p5-contrast-light-pink,
     admonition-background: #000000,
     admonition-border: #22C8ED,
     admonition-text: #ffffff,
@@ -249,7 +253,7 @@ $themes: (
     console-header-color: $lightest,
     console-input-background-color: $darker,
     editor-gutter-color: $darker,
-    error-color: $p5-contrast-pink,
+    error-color: $p5-contrast-light-pink,
     file-hover-color: $dark,
     file-selected-color: $medium-dark,
     form-navigation-options-color: $middle-light,
diff --git a/client/styles/components/_preferences.scss b/client/styles/components/_preferences.scss
index e0830f3543..30df4dcdaa 100644
--- a/client/styles/components/_preferences.scss
+++ b/client/styles/components/_preferences.scss
@@ -73,7 +73,7 @@
   & a {
     text-decoration: underline;
     @include themify() {
-      color: getThemifyVariable('button-background-hover-color');
+      color: getThemifyVariable('link-text-color');
     }
   }
   & a:hover {
@@ -154,7 +154,7 @@
     display: contents;
     & a {
       text-decoration: underline;
-      color: getThemifyVariable('button-background-hover-color');
+      color: getThemifyVariable('link-text-color');
     }
     & a:hover {
       text-decoration: underline;
diff --git a/client/theme.js b/client/theme.js
index 7aa4f6ed0e..e3247f92ed 100644
--- a/client/theme.js
+++ b/client/theme.js
@@ -19,7 +19,8 @@ export const colors = {
   red: '#ff0000',
   lightsteelblue: '#B0C4DE',
   dodgerblue: '#1E90FF',
-  p5ContrastPink: ' #FFA9D9',
+  p5ContrastLightPink: '#FFA9D9',
+  p5ContrastDarkPink: '#B20046',
   p5ContrastYellow: '#fff001',
   borderColor: ' #B5B5B5',
   outlineColor: '#0F9DD7'
@@ -71,6 +72,7 @@ const baseThemes = {
   [Theme.light]: {
     colors,
     ...common,
+    linkTextColor: colors.p5ContrastDarkPink,
     primaryTextColor: grays.dark,
     inactiveTextColor: grays.middleDark,
     backgroundColor: grays.lighter,
@@ -166,6 +168,7 @@ const baseThemes = {
   [Theme.dark]: {
     colors,
     ...common,
+    linkTextColor: colors.p5ContrastLightPink,
     primaryTextColor: grays.lightest,
     inactiveTextColor: grays.middleLight,
     backgroundColor: grays.darker,
@@ -269,6 +272,7 @@ export default {
     toolbarTextColor: grays.dark,
     toolbarBackgroundColor: grays.light,
     toolbarTextHoverColor: grays.dark,
+    linkTextColor: colors.p5ContrastLightPink,
 
     Button: {
       primary: {