feat: define color tokens

nix6839 · Sep 14, 2023 · 596a7a0 · 596a7a0
1 parent 4544419
commit 596a7a0
Showing 1 changed file with 46 additions and 0 deletions.
diff --git a/apps/portfolio/tailwind.config.ts b/apps/portfolio/tailwind.config.ts
@@ -1,10 +1,56 @@
+import tailwindColors from 'tailwindcss/colors.js';
+
 import type { Config } from 'tailwindcss';
 
+const COLORS = {
+  ...tailwindColors,
+  brand: '#b4ec94',
+} as const;
+
 const config = {
   content: ['./src/**/*.astro'],
   corePlugins: {
     preflight: false,
   },
+
+  theme: {
+    backgroundColor: {
+      primary: {
+        DEFAULT: COLORS.zinc['900'],
+      },
+    },
+
+    textColor: {
+      brand: {
+        DEFAULT: COLORS.brand,
+      },
+      primary: {
+        DEFAULT: COLORS.zinc['100'],
+        hover: COLORS.zinc['300'],
+        pressed: COLORS.zinc['400'],
+      },
+      secondary: {
+        DEFAULT: COLORS.zinc['200'],
+      },
+      tertiary: {
+        DEFAULT: COLORS.zinc['300'],
+      },
+    },
+
+    borderColor: {
+      primary: {
+        DEFAULT: COLORS.zinc['500'],
+      },
+    },
+
+    fill: {
+      icon: {
+        primary: {
+          DEFAULT: COLORS.zinc['200'],
+        },
+      },
+    },
+  },
 } satisfies Config;
 
 export default config;