106 lines
2.5 KiB
JavaScript
106 lines
2.5 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
content: [
|
|
"./index.html",
|
|
"./src/**/*.{js,ts,jsx,tsx}",
|
|
],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
// Main brand color - A sophisticated blue-purple
|
|
primary: {
|
|
50: '#f8fafc',
|
|
100: '#f1f5f9',
|
|
200: '#e2e8f0',
|
|
300: '#cbd5e1',
|
|
400: '#94a3b8',
|
|
500: '#64748b',
|
|
600: '#475569',
|
|
700: '#334155',
|
|
800: '#1e293b',
|
|
900: '#0f172a',
|
|
950: '#020617',
|
|
},
|
|
// Secondary color - Warm gray with slight purple undertone
|
|
neutral: {
|
|
50: '#f8f7f9',
|
|
100: '#f0eff2',
|
|
200: '#e3e1e7',
|
|
300: '#cbc8d2',
|
|
400: '#aba6b6',
|
|
500: '#8c869a',
|
|
600: '#726d81',
|
|
700: '#5d596a',
|
|
800: '#4a4754',
|
|
900: '#2f2d36',
|
|
},
|
|
// Success color - Soothing green
|
|
success: {
|
|
50: '#f0fdf6',
|
|
100: '#dcfce9',
|
|
200: '#bbf7d6',
|
|
300: '#86efac',
|
|
400: '#4ade80',
|
|
500: '#22c55e',
|
|
600: '#16a34a',
|
|
700: '#15803c',
|
|
800: '#166534',
|
|
900: '#14532d',
|
|
},
|
|
// Warning color - Soft orange
|
|
warning: {
|
|
50: '#fff8f1',
|
|
100: '#feecdc',
|
|
200: '#fcd9bd',
|
|
300: '#fdba8c',
|
|
400: '#ff9f56',
|
|
500: '#ff8a3d',
|
|
600: '#e67132',
|
|
700: '#c45d2b',
|
|
800: '#9c4a23',
|
|
900: '#7b3a1c',
|
|
},
|
|
// Error color - Refined red
|
|
error: {
|
|
50: '#fef2f2',
|
|
100: '#fee2e2',
|
|
200: '#fecaca',
|
|
300: '#fca5a5',
|
|
400: '#f87171',
|
|
500: '#ef4444',
|
|
600: '#dc2626',
|
|
700: '#b91c1c',
|
|
800: '#991b1b',
|
|
900: '#7f1d1d',
|
|
},
|
|
// Accent color - Vibrant purple
|
|
accent: {
|
|
50: '#faf5ff',
|
|
100: '#f3e8ff',
|
|
200: '#e9d5ff',
|
|
300: '#d8b4fe',
|
|
400: '#c084fc',
|
|
500: '#a855f7',
|
|
600: '#9333ea',
|
|
700: '#7e22ce',
|
|
800: '#6b21a8',
|
|
900: '#581c87',
|
|
},
|
|
},
|
|
fontFamily: {
|
|
sans: ['Inter var', 'sans-serif'],
|
|
display: ['Clash Display', 'sans-serif'],
|
|
},
|
|
spacing: {
|
|
'18': '4.5rem',
|
|
'88': '22rem',
|
|
'128': '32rem',
|
|
},
|
|
borderRadius: {
|
|
'4xl': '2rem',
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
};
|