diff --git a/fittrackee_client/src/components/Common/StatsChart/Chart.vue b/fittrackee_client/src/components/Common/StatsChart/Chart.vue
index e1779d13..54bc76e7 100644
--- a/fittrackee_client/src/components/Common/StatsChart/Chart.vue
+++ b/fittrackee_client/src/components/Common/StatsChart/Chart.vue
@@ -42,14 +42,16 @@
     () => store.getters[ROOT_STORE.GETTERS.DARK_MODE]
   )
   const lineColors = computed(() => ({
-    color: darkMode.value
-      ? chartsColors.darkMode.line
-      : chartsColors.ligthMode.line,
+    color:
+      darkMode.value !== false
+        ? chartsColors.darkMode.line
+        : chartsColors.ligthMode.line,
   }))
   const textColors = computed(() => ({
-    color: darkMode.value
-      ? chartsColors.darkMode.text
-      : chartsColors.ligthMode.text,
+    color:
+      darkMode.value !== false
+        ? chartsColors.darkMode.text
+        : chartsColors.ligthMode.text,
   }))
 
   const chartData = computed(() => ({
diff --git a/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutChart/index.vue b/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutChart/index.vue
index ebf1edb7..cd56fb5e 100644
--- a/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutChart/index.vue
+++ b/fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutChart/index.vue
@@ -118,14 +118,16 @@
     () => datasets.value.coordinates
   )
   const lineColors = computed(() => ({
-    color: darkMode.value
-      ? chartsColors.darkMode.line
-      : chartsColors.ligthMode.line,
+    color:
+      darkMode.value !== false
+        ? chartsColors.darkMode.line
+        : chartsColors.ligthMode.line,
   }))
   const textColors = computed(() => ({
-    color: darkMode.value
-      ? chartsColors.darkMode.text
-      : chartsColors.ligthMode.text,
+    color:
+      darkMode.value !== false
+        ? chartsColors.darkMode.text
+        : chartsColors.ligthMode.text,
   }))
 
   const options = computed<ChartOptions<'line'>>(() => ({