/ tailwind.config.ts
tailwind.config.ts
1 import type { Config } from "tailwindcss"; 2 3 export default { 4 darkMode: ["class"], 5 content: [ 6 "./pages/**/*.{js,ts,jsx,tsx,mdx}", 7 "./components/**/*.{js,ts,jsx,tsx,mdx}", 8 "./app/**/*.{js,ts,jsx,tsx,mdx}", 9 ], 10 theme: { 11 extend: { 12 colors: { 13 background: 'hsl(var(--background))', 14 foreground: 'hsl(var(--foreground))', 15 card: { 16 DEFAULT: 'hsl(var(--card))', 17 foreground: 'hsl(var(--card-foreground))' 18 }, 19 popover: { 20 DEFAULT: 'hsl(var(--popover))', 21 foreground: 'hsl(var(--popover-foreground))' 22 }, 23 primary: { 24 DEFAULT: 'hsl(var(--primary))', 25 foreground: 'hsl(var(--primary-foreground))' 26 }, 27 secondary: { 28 DEFAULT: 'hsl(var(--secondary))', 29 foreground: 'hsl(var(--secondary-foreground))' 30 }, 31 muted: { 32 DEFAULT: 'hsl(var(--muted))', 33 foreground: 'hsl(var(--muted-foreground))' 34 }, 35 accent: { 36 DEFAULT: 'hsl(var(--accent))', 37 foreground: 'hsl(var(--accent-foreground))' 38 }, 39 destructive: { 40 DEFAULT: 'hsl(var(--destructive))', 41 foreground: 'hsl(var(--destructive-foreground))' 42 }, 43 border: 'hsl(var(--border))', 44 input: 'hsl(var(--input))', 45 ring: 'hsl(var(--ring))', 46 chart: { 47 '1': 'hsl(var(--chart-1))', 48 '2': 'hsl(var(--chart-2))', 49 '3': 'hsl(var(--chart-3))', 50 '4': 'hsl(var(--chart-4))', 51 '5': 'hsl(var(--chart-5))' 52 } 53 }, 54 borderRadius: { 55 lg: 'var(--radius)', 56 md: 'calc(var(--radius) - 2px)', 57 sm: 'calc(var(--radius) - 4px)' 58 } 59 } 60 }, 61 plugins: [require("tailwindcss-animate")], 62 } satisfies Config;