diff --git a/libs/ui/src/lib/fire-calculator/fire-calculator.component.ts b/libs/ui/src/lib/fire-calculator/fire-calculator.component.ts
index f8ce3dd50..64fbe1b74 100644
--- a/libs/ui/src/lib/fire-calculator/fire-calculator.component.ts
+++ b/libs/ui/src/lib/fire-calculator/fire-calculator.component.ts
@@ -41,7 +41,7 @@ import {
   Tooltip
 } from 'chart.js';
 import 'chartjs-adapter-date-fns';
-import * as Color from 'color';
+import Color from 'color';
 import {
   add,
   addYears,
diff --git a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts
index 6319c3cd7..cc3c40d32 100644
--- a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts
+++ b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts
@@ -29,7 +29,7 @@ import { ArcElement } from 'chart.js';
 import { DoughnutController } from 'chart.js';
 import { Chart } from 'chart.js';
 import ChartDataLabels from 'chartjs-plugin-datalabels';
-import * as Color from 'color';
+import Color from 'color';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
 
 const {