tailwind.config.ts

 1import type { Config } from "tailwindcss";
 2
 3const config: Config = {
 4  darkMode: ["class"],
 5  content: ["./index.html", "./src/**/*.{ts,tsx}"],
 6  theme: {
 7    extend: {
 8      fontFamily: {
 9        sans: ["ui-sans-serif", "system-ui", "sans-serif"],
10        mono: ["ui-monospace", "SFMono-Regular", "SF Mono", "Menlo", "monospace"],
11      },
12      colors: {
13        border: "hsl(var(--border))",
14        input: "hsl(var(--input))",
15        ring: "hsl(var(--ring))",
16        background: "hsl(var(--background))",
17        foreground: "hsl(var(--foreground))",
18        primary: {
19          DEFAULT: "hsl(var(--primary))",
20          foreground: "hsl(var(--primary-foreground))",
21        },
22        secondary: {
23          DEFAULT: "hsl(var(--secondary))",
24          foreground: "hsl(var(--secondary-foreground))",
25        },
26        destructive: {
27          DEFAULT: "hsl(var(--destructive))",
28          foreground: "hsl(var(--destructive-foreground))",
29        },
30        muted: {
31          DEFAULT: "hsl(var(--muted))",
32          foreground: "hsl(var(--muted-foreground))",
33        },
34        accent: {
35          DEFAULT: "hsl(var(--accent))",
36          foreground: "hsl(var(--accent-foreground))",
37        },
38        popover: {
39          DEFAULT: "hsl(var(--popover))",
40          foreground: "hsl(var(--popover-foreground))",
41        },
42        card: {
43          DEFAULT: "hsl(var(--card))",
44          foreground: "hsl(var(--card-foreground))",
45        },
46      },
47      borderRadius: {
48        lg: "var(--radius)",
49        md: "calc(var(--radius) - 2px)",
50        sm: "calc(var(--radius) - 4px)",
51      },
52      keyframes: {
53        "accordion-down": {
54          from: { height: "0" },
55          to: { height: "var(--radix-accordion-content-height)" },
56        },
57        "accordion-up": {
58          from: { height: "var(--radix-accordion-content-height)" },
59          to: { height: "0" },
60        },
61      },
62      animation: {
63        "accordion-down": "accordion-down 0.2s ease-out",
64        "accordion-up": "accordion-up 0.2s ease-out",
65      },
66    },
67  },
68  plugins: [require("tailwindcss-animate"), require("@tailwindcss/typography")],
69};
70
71export default config;