diff --git a/src/theme/variables/edgeLight.ts b/src/theme/variables/edgeLight.ts
index 0208b0dcaa5..ef4e84d8b56 100644
--- a/src/theme/variables/edgeLight.ts
+++ b/src/theme/variables/edgeLight.ts
@@ -77,6 +77,10 @@ const palette = {
   learnMiddle: 'rgba(0, 81, 92, .44)',
   learnRight: 'rgba(0, 245, 155, .44)',
 
+  // Background
+  backgroundGreen: '#15cb7f',
+  backgroundPurple: '#7f15cb',
+
   // Button
   graySecondary: 'hsla(0, 0%, 100%, 0.20)',
 
@@ -127,8 +131,8 @@ export const edgeLight: Theme = {
     color: palette.lightestGray,
     dotOpacity: 0.3,
     dots: [
-      { color: '#15cb7f', cx: '75%', cy: '25%', r: scale(175) },
-      { color: '#7f15cb', cx: '25%', cy: '75%', r: scale(150) }
+      { color: palette.backgroundGreen, cx: '75%', cy: '25%', r: scale(175) },
+      { color: palette.backgroundPurple, cx: '25%', cy: '75%', r: scale(150) }
     ]
   },
 
diff --git a/src/theme/variables/testLight.ts b/src/theme/variables/testLight.ts
index 78782bd8625..904eb1656cb 100644
--- a/src/theme/variables/testLight.ts
+++ b/src/theme/variables/testLight.ts
@@ -77,6 +77,10 @@ const palette = {
   learnMiddle: 'rgba(0, 81, 92, .44)',
   learnRight: 'rgba(0, 245, 155, .44)',
 
+  // Background
+  backgroundGreen: '#15cb7f',
+  backgroundPurple: '#7f15cb',
+
   // Button
   graySecondary: 'hsla(0, 0%, 100%, 0.20)',
 
@@ -127,8 +131,8 @@ export const testLight: Theme = {
     color: palette.lightestGray,
     dotOpacity: 0.3,
     dots: [
-      { color: '#15cb7f', cx: '75%', cy: '25%', r: scale(175) },
-      { color: '#7f15cb', cx: '25%', cy: '75%', r: scale(150) }
+      { color: palette.backgroundGreen, cx: '75%', cy: '25%', r: scale(175) },
+      { color: palette.backgroundPurple, cx: '25%', cy: '75%', r: scale(150) }
     ]
   },