tailwind.config.ts 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. import type { Config } from "tailwindcss";
  2. import animate from "tailwindcss-animate";
  3. export default {
  4. darkMode: ["class"],
  5. content: [
  6. "./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
  7. "./src/components/**/*.{js,ts,jsx,tsx,mdx}",
  8. "./src/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: [animate],
  62. } satisfies Config;