diff --git a/app/Http/Controllers/Chart/CategoryController.php b/app/Http/Controllers/Chart/CategoryController.php
index 280442c8f2..14955e6413 100644
--- a/app/Http/Controllers/Chart/CategoryController.php
+++ b/app/Http/Controllers/Chart/CategoryController.php
@@ -79,12 +79,14 @@ class CategoryController extends Controller
         $accounts  = $accountRepository->getAccountsByType([AccountType::DEFAULT, AccountType::ASSET]);
         $chartData = [
             [
-                'label'   => (string)trans('firefly.spent'),
-                'entries' => [], 'type' => 'bar',
+                'label'           => (string)trans('firefly.spent'),
+                'entries'         => [], 'type' => 'bar',
+                'backgroundColor' => 'rgba(219, 68, 55, 0.5)', // red
             ],
             [
-                'label'   => (string)trans('firefly.earned'),
-                'entries' => [], 'type' => 'bar',
+                'label'           => (string)trans('firefly.earned'),
+                'entries'         => [], 'type' => 'bar',
+                'backgroundColor' => 'rgba(0, 141, 76, 0.5)', // green
             ],
             [
                 'label'   => (string)trans('firefly.sum'),
@@ -184,14 +186,16 @@ class CategoryController extends Controller
         $periods    = app('navigation')->listOfPeriods($start, $end);
         $chartData  = [
             [
-                'label'   => (string)trans('firefly.spent'),
-                'entries' => [],
-                'type'    => 'bar',
+                'label'           => (string)trans('firefly.spent'),
+                'entries'         => [],
+                'type'            => 'bar',
+                'backgroundColor' => 'rgba(219, 68, 55, 0.5)', // red
             ],
             [
-                'label'   => (string)trans('firefly.earned'),
-                'entries' => [],
-                'type'    => 'bar',
+                'label'           => (string)trans('firefly.earned'),
+                'entries'         => [],
+                'type'            => 'bar',
+                'backgroundColor' => 'rgba(0, 141, 76, 0.5)', // green
             ],
             [
                 'label'   => (string)trans('firefly.sum'),
@@ -245,14 +249,16 @@ class CategoryController extends Controller
         $periods    = app('navigation')->listOfPeriods($start, $end);
         $chartData  = [
             [
-                'label'   => (string)trans('firefly.spent'),
-                'entries' => [],
-                'type'    => 'bar',
+                'label'           => (string)trans('firefly.spent'),
+                'entries'         => [],
+                'type'            => 'bar',
+                'backgroundColor' => 'rgba(219, 68, 55, 0.5)', // red
             ],
             [
-                'label'   => (string)trans('firefly.earned'),
-                'entries' => [],
-                'type'    => 'bar',
+                'label'           => (string)trans('firefly.earned'),
+                'entries'         => [],
+                'type'            => 'bar',
+                'backgroundColor' => 'rgba(0, 141, 76, 0.5)', // green
             ],
             [
                 'label'   => (string)trans('firefly.sum'),
@@ -328,14 +334,16 @@ class CategoryController extends Controller
         // chart data
         $chartData = [
             [
-                'label'   => (string)trans('firefly.spent'),
-                'entries' => [],
-                'type'    => 'bar',
+                'label'           => (string)trans('firefly.spent'),
+                'entries'         => [],
+                'type'            => 'bar',
+                'backgroundColor' => 'rgba(219, 68, 55, 0.5)', // red
             ],
             [
-                'label'   => (string)trans('firefly.earned'),
-                'entries' => [],
-                'type'    => 'bar',
+                'label'           => (string)trans('firefly.earned'),
+                'entries'         => [],
+                'type'            => 'bar',
+                'backgroundColor' => 'rgba(0, 141, 76, 0.5)', // green
             ],
             [
                 'label'   => (string)trans('firefly.sum'),
diff --git a/public/js/ff/categories/show.js b/public/js/ff/categories/show.js
index 8b83ac44a5..548a1c3022 100644
--- a/public/js/ff/categories/show.js
+++ b/public/js/ff/categories/show.js
@@ -23,7 +23,7 @@
 $(function () {
     "use strict";
 
-    columnChart(everything, 'category-everything');
-    columnChart(specific, 'specific-period');
+    columnChartCustomColours(everything, 'category-everything');
+    columnChartCustomColours(specific, 'specific-period');
 
 });
\ No newline at end of file