diff --git a/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx b/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx
index c0137ea9..2dcb2b81 100644
--- a/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx
+++ b/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx
@@ -52,7 +52,6 @@ export function WebsiteMetricsBar({
               change={uniques.change}
             />
             <MetricCard
-              className={styles.card}
               label={formatMessage(labels.bounceRate)}
               value={uniques.value ? (num / uniques.value) * 100 : 0}
               change={
@@ -65,7 +64,6 @@ export function WebsiteMetricsBar({
               reverseColors
             />
             <MetricCard
-              className={styles.card}
               label={formatMessage(labels.averageVisitTime)}
               value={
                 totaltime.value && pageviews.value
diff --git a/src/components/metrics/MetricCard.module.css b/src/components/metrics/MetricCard.module.css
index 78505321..8ddecc10 100644
--- a/src/components/metrics/MetricCard.module.css
+++ b/src/components/metrics/MetricCard.module.css
@@ -13,6 +13,7 @@
   font-weight: 700;
   white-space: nowrap;
   min-height: 60px;
+  color: var(--base900);
 }
 
 .label {
@@ -22,6 +23,7 @@
   gap: 10px;
   white-space: nowrap;
   min-height: 30px;
+  color: var(--base800);
 }
 
 .change {