mirror of
https://github.com/FranP-code/create-better-t-stack.git
synced 2025-10-12 23:52:15 +00:00
99 lines
2.0 KiB
TypeScript
99 lines
2.0 KiB
TypeScript
const sharedColors = {
|
|
success: "#22C55E",
|
|
destructive: "#EF4444",
|
|
warning: "#F59E0B",
|
|
info: "#3B82F6",
|
|
} as const;
|
|
|
|
export const lightTheme = {
|
|
colors: {
|
|
...sharedColors,
|
|
typography: "hsl(222.2 84% 4.9%)",
|
|
background: "hsl(0 0% 100%)",
|
|
foreground: "hsl(222.2 84% 4.9%)",
|
|
card: "hsl(0 0% 100%)",
|
|
cardForeground: "hsl(222.2 84% 4.9%)",
|
|
primary: "hsl(221.2 83.2% 53.3%)",
|
|
primaryForeground: "hsl(210 40% 98%)",
|
|
secondary: "hsl(210 40% 96%)",
|
|
secondaryForeground: "hsl(222.2 84% 4.9%)",
|
|
muted: "hsl(210 40% 96%)",
|
|
mutedForeground: "hsl(215.4 16.3% 46.9%)",
|
|
accent: "hsl(210 40% 96%)",
|
|
accentForeground: "hsl(222.2 84% 4.9%)",
|
|
border: "hsl(214.3 31.8% 91.4%)",
|
|
input: "hsl(214.3 31.8% 91.4%)",
|
|
ring: "hsl(221.2 83.2% 53.3%)",
|
|
},
|
|
spacing: {
|
|
xs: 4,
|
|
sm: 8,
|
|
md: 16,
|
|
lg: 24,
|
|
xl: 32,
|
|
xxl: 48,
|
|
},
|
|
borderRadius: {
|
|
sm: 6,
|
|
md: 8,
|
|
lg: 12,
|
|
xl: 16,
|
|
},
|
|
fontSize: {
|
|
xs: 12,
|
|
sm: 14,
|
|
base: 16,
|
|
lg: 18,
|
|
xl: 20,
|
|
"2xl": 24,
|
|
"3xl": 30,
|
|
"4xl": 36,
|
|
},
|
|
} as const;
|
|
|
|
export const darkTheme = {
|
|
colors: {
|
|
...sharedColors,
|
|
typography: "hsl(210 40% 98%)",
|
|
background: "hsl(222.2 84% 4.9%)",
|
|
foreground: "hsl(210 40% 98%)",
|
|
card: "hsl(222.2 84% 4.9%)",
|
|
cardForeground: "hsl(210 40% 98%)",
|
|
primary: "hsl(217.2 91.2% 59.8%)",
|
|
primaryForeground: "hsl(222.2 84% 4.9%)",
|
|
secondary: "hsl(217.2 32.6% 17.5%)",
|
|
secondaryForeground: "hsl(210 40% 98%)",
|
|
muted: "hsl(217.2 32.6% 17.5%)",
|
|
mutedForeground: "hsl(215 20.2% 65.1%)",
|
|
accent: "hsl(217.2 32.6% 17.5%)",
|
|
accentForeground: "hsl(210 40% 98%)",
|
|
border: "hsl(217.2 32.6% 17.5%)",
|
|
input: "hsl(217.2 32.6% 17.5%)",
|
|
ring: "hsl(224.3 76.3% 94.1%)",
|
|
},
|
|
spacing: {
|
|
xs: 4,
|
|
sm: 8,
|
|
md: 16,
|
|
lg: 24,
|
|
xl: 32,
|
|
xxl: 48,
|
|
},
|
|
borderRadius: {
|
|
sm: 6,
|
|
md: 8,
|
|
lg: 12,
|
|
xl: 16,
|
|
},
|
|
fontSize: {
|
|
xs: 12,
|
|
sm: 14,
|
|
base: 16,
|
|
lg: 18,
|
|
xl: 20,
|
|
"2xl": 24,
|
|
"3xl": 30,
|
|
"4xl": 36,
|
|
},
|
|
} as const;
|