Colors for Tailwind CSS, using CSS variables

hotosm · Nov 28, 2023 · d7348d7 · d7348d7
1 parent 88668c7
commit d7348d7
Showing 1 changed file with 9 additions and 2 deletions.
diff --git a/tailwind.config.js b/tailwind.config.js
@@ -1,3 +1,5 @@
+const colors = require('tailwindcss/colors')
+
 /** @type {import('tailwindcss').Config} */
 module.exports = {
   content: ["./src/**/*.{js,ts,jsx,tsx}"],
@@ -7,8 +9,13 @@ module.exports = {
         DEFAULT: "0.125rem",
       },
       colors: {
-        primary: "#d73f3f",
-        secondary: "#2C3038",
+        ...colors,
+        primary: 'rgb(var(--hot-primary-rgb))',
+        secondary: 'rgb(var(--hot-secondary-rgb) / <alpha-value>)',
+        info: 'rgb(var(--hot-info-rgb) / <alpha-value>)',
+        error: 'rgb(var(--hot-error-rgb) / <alpha-value>)',
+        warning: 'rgb(var(--hot-warning-rgb) / <alpha-value>)',
+        success: 'rgb(var(--hot-success-rgb) / <alpha-value>)',
       },
     },
   },