diff --git a/assets/css/app.scss b/assets/css/app.scss
index b265b39e62..e12b413be2 100644
--- a/assets/css/app.scss
+++ b/assets/css/app.scss
@@ -58,7 +58,7 @@
   }
 
   .btn-primary {
-    @apply text-white bg-ch-primary hover:bg-ch-primary focus:ring-indigo-500;
+    @apply text-white bg-ch-primary hover:bg-ch-primary-dark focus:ring-ch-primary-dark;
   }
 
   .btn-warning {
@@ -70,7 +70,7 @@
   }
 
   .btn-danger {
-    @apply text-white bg-red-700 hover:bg-red-800;
+    @apply text-white bg-ch-error hover:bg-ch-error-dark;
   }
 
   // Buttons with icons.
diff --git a/tailwind.config.js b/tailwind.config.js
index 73013d301b..d51516b98b 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -7,18 +7,14 @@ module.exports = {
         sans: ['Helvetica Neue', 'Helvetica', 'Arial', 'sans-serif']
       },
       colors: {
-        'ch-primary': '#2e75a3',
-        'ch-secondary': '#fd6600',
-        'ch-grayscale-100': '#000',
-        'ch-grayscale-90': '#333',
-        'ch-grayscale-50': '#a2a6b0',
-        'ch-grayscale-30': 'rgba(0, 0, 0, 0.12)',
-        'ch-grayscale-25': '#e4e9ed',
-        'ch-grayscale-20': '#edf0f2',
-        'ch-grayscale-15': '#f7f8f9',
-        'ch-grayscale-10': '#fafafa',
-        'ch-grayscale-5': 'rgba(250, 250, 250, 0.5)',
-        'ch-grayscale-0': '#fff',
+        'ch-primary': {
+          DEFAULT: '#2e75a3',
+          'dark': '#1c6391',
+        },
+        'ch-secondary': {
+          DEFAULT: '#fd6600',
+          'dark': '#ea5300',
+        },
         'ch-support-1': 'rgba(46, 117, 163, 0.08)',
         'ch-support-2': '#f5f8fa',
         'ch-support-3': 'rgba(46, 117, 163, 0.5)',
@@ -27,7 +23,10 @@ module.exports = {
         'ch-support-6': '#faf7f5',
         'ch-warning': '#eddf0e',
         'ch-success': '#a4dc2d',
-        'ch-error': '#ef3e3e',
+        'ch-error': {
+          DEFAULT: '#ef3e3e',
+          'dark': '#dc2b2b',
+        },
         'ch-info': '#3e9aef'
       }
     },