Files
portfolio/tailwind.config.ts
2026-01-07 14:30:00 +01:00

86 lines
2.2 KiB
TypeScript

// tailwind.config.ts
import type { Config } from "tailwindcss";
// tailwind.config.js
export default {
darkMode: "class", // Enables class-based dark mode
content: [
"./app/**/*.{js,ts,jsx,tsx}",
"./app/components/**/*.{js,ts,jsx,tsx}",
// Add other paths if necessary
],
theme: {
extend: {
colors: {
background: "var(--background)",
foreground: "var(--foreground)",
card: {
DEFAULT: "var(--card)",
foreground: "var(--card-foreground)",
},
popover: {
DEFAULT: "var(--popover)",
foreground: "var(--popover-foreground)",
},
primary: {
DEFAULT: "var(--primary)",
foreground: "var(--primary-foreground)",
},
secondary: {
DEFAULT: "var(--secondary)",
foreground: "var(--secondary-foreground)",
},
muted: {
DEFAULT: "var(--muted)",
foreground: "var(--muted-foreground)",
},
accent: {
DEFAULT: "var(--accent)",
foreground: "var(--accent-foreground)",
},
destructive: {
DEFAULT: "var(--destructive)",
foreground: "var(--destructive-foreground)",
},
border: "var(--border)",
input: "var(--input)",
ring: "var(--ring)",
cream: "#FDFCF8",
sand: "#F3F1E7",
stone: {
50: "#FAFAF9",
100: "#F5F5F4",
200: "#E7E5E4",
300: "#D6D3D1",
400: "#A8A29E",
500: "#78716C",
600: "#57534E",
700: "#44403C",
800: "#292524",
900: "#1C1917",
},
liquid: {
mint: "#A7F3D0",
lavender: "#DDD6FE",
blue: "#BFDBFE",
rose: "#FECACA",
yellow: "#FDE68A",
peach: "#FED7AA",
pink: "#FBCFE8",
sky: "#BAE6FD",
lime: "#D9F99D",
coral: "#FCA5A5",
purple: "#E9D5FF",
teal: "#99F6E4",
amber: "#FDE047",
},
},
fontFamily: {
sans: ["var(--font-inter)", "sans-serif"],
mono: ["var(--font-roboto-mono)", "monospace"],
},
},
},
plugins: [],
} satisfies Config;