create-better-t-stack
Version:
A modern CLI tool for scaffolding end-to-end type-safe TypeScript projects with best practices and customizable configurations
99 lines (96 loc) • 2.09 kB
text/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;