126 lines
2.0 KiB
TypeScript
126 lines
2.0 KiB
TypeScript
// Update me with other Tailwind colors or with https://smart-swatch.netlify.app/
|
|
const brand = {
|
|
50: '#e3edff',
|
|
100: '#b6c9fd',
|
|
200: '#88a5f7',
|
|
300: '#5a81f2',
|
|
400: '#2c5ded',
|
|
500: '#1543d4',
|
|
600: '#0d34a5',
|
|
700: '#062577',
|
|
800: '#02164a',
|
|
900: '#00071e',
|
|
};
|
|
|
|
const back = {
|
|
50: '#f2f2f2',
|
|
100: '#d9d9d9',
|
|
200: '#bfbfbf',
|
|
300: '#a6a6a6',
|
|
400: '#8c8c8c',
|
|
500: '#737373',
|
|
600: '#595959',
|
|
700: '#404040',
|
|
800: '#262626',
|
|
900: '#0d0d0d',
|
|
};
|
|
|
|
const green = {
|
|
50: '#f0fdf4',
|
|
100: '#dcfce7',
|
|
200: '#bbf7d0',
|
|
300: '#86efac',
|
|
400: '#4ade80',
|
|
500: '#22c55e',
|
|
600: '#16a34a',
|
|
700: '#15803d',
|
|
800: '#166534',
|
|
900: '#14532d',
|
|
};
|
|
const blue = {
|
|
50: '#eff6ff',
|
|
100: '#dbeafe',
|
|
200: '#bfdbfe',
|
|
300: '#93c5fd',
|
|
400: '#60a5fa',
|
|
500: '#3b82f6',
|
|
600: '#2563eb',
|
|
700: '#1d4ed8',
|
|
800: '#1e40af',
|
|
900: '#1e3a8a',
|
|
};
|
|
const orange = {
|
|
50: '#fff7ed',
|
|
100: '#ffedd5',
|
|
200: '#fed7aa',
|
|
300: '#fdba74',
|
|
400: '#fb923c',
|
|
500: '#f97316',
|
|
600: '#ea580c',
|
|
700: '#c2410c',
|
|
800: '#9a3412',
|
|
900: '#7c2d12',
|
|
};
|
|
const red = {
|
|
50: '#fef2f2',
|
|
100: '#fee2e2',
|
|
200: '#fecaca',
|
|
300: '#fca5a5',
|
|
400: '#f87171',
|
|
500: '#ef4444',
|
|
600: '#dc2626',
|
|
700: '#b91c1c',
|
|
800: '#991b1b',
|
|
900: '#7f1d1d',
|
|
};
|
|
const yellow = {
|
|
50: '#ffffda',
|
|
100: '#ffffad',
|
|
200: '#ffff7d',
|
|
300: '#ffff4b',
|
|
400: '#ffff1a',
|
|
500: '#e5e600',
|
|
600: '#b2b300',
|
|
700: '#7f8000',
|
|
800: '#4c4d00',
|
|
900: '#191b00',
|
|
};
|
|
const purple = {
|
|
50: '#ffe3ff',
|
|
100: '#ffb2ff',
|
|
200: '#ff80ff',
|
|
300: '#fe4efe',
|
|
400: '#fe20fe',
|
|
500: '#e50ce4',
|
|
600: '#b204b1',
|
|
700: '#80007f',
|
|
800: '#4e004d',
|
|
900: '#1d001c',
|
|
};
|
|
|
|
const cyan = {
|
|
50: '#d6ffff',
|
|
100: '#aaffff',
|
|
200: '#7affff',
|
|
300: '#47ffff',
|
|
400: '#1affff',
|
|
500: '#00e5e6',
|
|
600: '#00b2b3',
|
|
700: '#008081',
|
|
800: '#004d4e',
|
|
900: '#001b1d',
|
|
}
|
|
|
|
export const basicColor = {
|
|
green, red, orange, back, blue, yellow, purple, cyan
|
|
}
|
|
|
|
export const colors = {
|
|
|
|
brand: brand,
|
|
back: back,
|
|
success: green,
|
|
error: red,
|
|
warning: orange,
|
|
} as const;
|