diff --git a/src/components/AllStatsOverview/components/WN8Display/index.tsx b/src/components/AllStatsOverview/components/WN8Display/index.tsx
index 6e8fe8aba..3e33af43b 100644
--- a/src/components/AllStatsOverview/components/WN8Display/index.tsx
+++ b/src/components/AllStatsOverview/components/WN8Display/index.tsx
@@ -37,7 +37,7 @@ export function WN8Display({ WN8 }: WN8DisplayProps) {
         gap: -16,
       }}
     >
-      <Glow color={PERCENTILE_COLORS[percentile]} />
+      <Glow color={color} />
 
       <div
         style={{
@@ -71,7 +71,7 @@ export function WN8Display({ WN8 }: WN8DisplayProps) {
         </span>
       </div>
 
-      <Glow color={PERCENTILE_COLORS[percentile]} direction="reverse" />
+      <Glow color={color} direction="reverse" />
     </div>
   );
 }
diff --git a/src/components/PercentileIndicator.tsx b/src/components/PercentileIndicator.tsx
index 548a46039..25fe22e6c 100644
--- a/src/components/PercentileIndicator.tsx
+++ b/src/components/PercentileIndicator.tsx
@@ -1,4 +1,5 @@
 import {
+  amber,
   blue,
   green,
   lime,
@@ -8,7 +9,6 @@ import {
   red,
   slate,
   teal,
-  yellow,
 } from '@radix-ui/colors';
 import { Percentile } from '../constants/percentiles';
 
@@ -20,8 +20,8 @@ export const PERCENTILE_COLORS = {
   [Percentile.VeryBad]: slate.slate9,
   [Percentile.Bad]: red.red9,
   [Percentile.BelowAverage]: orange.orange9,
-  [Percentile.Average]: yellow.yellow9,
-  [Percentile.AboveAverage]: lime.lime9,
+  [Percentile.Average]: amber.amber10,
+  [Percentile.AboveAverage]: lime.lime8,
   [Percentile.Good]: green.green9,
   [Percentile.VeryGood]: teal.teal9,
   [Percentile.Great]: blue.blue9,