diff --git a/src/pages/15_dash-board/chart/ChartReceipt.vue b/src/pages/15_dash-board/chart/ChartReceipt.vue
index 4e367ed6..e7423fbc 100644
--- a/src/pages/15_dash-board/chart/ChartReceipt.vue
+++ b/src/pages/15_dash-board/chart/ChartReceipt.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { Icon } from '@iconify/vue/dist/iconify.js';
-import VueApexCharts from 'vue3-apexcharts';
+import VueApexCharts, { VueApexChartsComponent } from 'vue3-apexcharts';
 import DataDisplay from 'src/components/08_request-list/DataDisplay.vue';
 import { computed } from 'vue';
 import { formatNumberDecimal } from 'src/stores/utils';
@@ -22,12 +22,13 @@ const prop = withDefaults(
   },
 );
 
-const chartOptions = computed(() => {
+const chartOptions = computed<VueApexChartsComponent['options']>(() => {
   return {
     colors: ['#035aa1', '#ae3ec9', '#ffa94d', '#e64980'],
     chart: {
       fontFamily: 'Noto Sans Thai',
       type: 'line',
+      foreColor: 'var(--foreground)',
       zoom: {
         enabled: false,
       },