nord color schema

This commit is contained in:
echo 2026-03-11 08:33:09 +01:00
parent e3a3c3fccf
commit df08ff8950

View File

@ -1,10 +1,11 @@
/** /**
* FitAI Color System * FitAI Color System
* Minimalist muted earth tones with light and dark mode support * Nord Color Palette - A minimal, arctic-inspired palette
* https://www.nordtheme.com/
*/ */
export interface ColorScheme { export interface ColorScheme {
// Primary Earth Tones // Primary Colors
primary: string; primary: string;
primaryDark: string; primaryDark: string;
primaryLight: string; primaryLight: string;
@ -45,90 +46,90 @@ export interface ColorScheme {
/** /**
* Light Mode Color Palette * Light Mode Color Palette
* Natural, warm, muted earth tones * Nord Snow Storm (light backgrounds) with Polar Night (dark text)
*/ */
export const lightColors: ColorScheme = { export const lightColors: ColorScheme = {
// Primary Earth Tones // Primary Colors (Nord Frost - Aurora blue-green)
primary: "#6B9080", // Muted sage green (main actions) primary: "#88C0D0", // Nord Frost 8 (main actions, cyan)
primaryDark: "#5A7A6E", // Darker sage primaryDark: "#5E81AC", // Nord Frost 10 (dark blue)
primaryLight: "#8AAE9E", // Lighter sage primaryLight: "#8FBCBB", // Nord Frost 7 (pale cyan)
// Accent Colors (minimal use) // Accent Colors
accent: "#A9B4A0", // Warm gray-green accent: "#81A1C1", // Nord Frost 9 (blue-gray)
terracotta: "#C1876B", // Warm terracotta (highlights) terracotta: "#D08770", // Nord Aurora 12 (orange - replaces terracotta)
sand: "#E8DCC4", // Warm sand (backgrounds) sand: "#EBCB8B", // Nord Aurora 13 (yellow - warm accent)
// Status Colors (muted) // Status Colors
success: "#7BA05B", // Muted olive green success: "#A3BE8C", // Nord Aurora 14 (green)
warning: "#D4A574", // Muted amber warning: "#EBCB8B", // Nord Aurora 13 (yellow)
danger: "#B66B6B", // Muted rust red danger: "#BF616A", // Nord Aurora 11 (red)
info: "#7B9BB0", // Muted blue-gray info: "#81A1C1", // Nord Frost 9 (blue)
// Neutrals // Neutrals (Snow Storm palette)
background: "#F9F7F4", // Warm off-white background: "#ECEFF4", // Nord Snow Storm 3 (lightest)
surface: "#FFFFFF", // Pure white surface: "#E5E9F0", // Nord Snow Storm 2 (medium)
surfaceElevated: "#FEFDFB", // Slightly warm white surfaceElevated: "#D8DEE9", // Nord Snow Storm 1 (slightly darker)
// Text // Text (Polar Night palette)
textPrimary: "#2C3731", // Deep forest textPrimary: "#2E3440", // Nord Polar Night 0 (darkest)
textSecondary: "#5C6B61", // Medium forest textSecondary: "#3B4252", // Nord Polar Night 1
textTertiary: "#8B9A8F", // Light forest textTertiary: "#4C566A", // Nord Polar Night 3
// Borders // Borders
border: "#E8E4DF", // Very light warm gray border: "#D8DEE9", // Nord Snow Storm 1
borderLight: "#F2EFE9", // Ultra light warm gray borderLight: "#E5E9F0", // Nord Snow Storm 2
// Overlays // Overlays
overlay: "rgba(44, 55, 49, 0.5)", overlay: "rgba(46, 52, 64, 0.5)", // Polar Night 0
overlayLight: "rgba(44, 55, 49, 0.05)", overlayLight: "rgba(46, 52, 64, 0.05)",
// Legacy // Legacy
white: "#FFFFFF", white: "#ECEFF4",
black: "#2C3731", black: "#2E3440",
}; };
/** /**
* Dark Mode Color Palette * Dark Mode Color Palette
* Warm dark tones with adjusted earth colors for contrast * Nord Polar Night (dark backgrounds) with Snow Storm (light text)
*/ */
export const darkColors: ColorScheme = { export const darkColors: ColorScheme = {
// Primary Earth Tones (adjusted for dark) // Primary Colors (Nord Frost - adjusted for dark mode)
primary: "#8AAE9E", // Lighter sage for contrast primary: "#88C0D0", // Nord Frost 8 (cyan - brighter on dark)
primaryDark: "#6B9080", primaryDark: "#5E81AC", // Nord Frost 10 (dark blue)
primaryLight: "#A4C4B5", primaryLight: "#8FBCBB", // Nord Frost 7 (pale cyan)
// Accent Colors // Accent Colors
accent: "#B5C2B0", accent: "#81A1C1", // Nord Frost 9 (blue-gray)
terracotta: "#D4A285", terracotta: "#D08770", // Nord Aurora 12 (orange)
sand: "#4A4539", // Dark sand sand: "#EBCB8B", // Nord Aurora 13 (yellow)
// Status Colors // Status Colors
success: "#8DB76A", success: "#A3BE8C", // Nord Aurora 14 (green)
warning: "#E0B886", warning: "#EBCB8B", // Nord Aurora 13 (yellow)
danger: "#C87D7D", danger: "#BF616A", // Nord Aurora 11 (red)
info: "#8FADC4", info: "#81A1C1", // Nord Frost 9 (blue)
// Neutrals // Neutrals (Polar Night palette)
background: "#1C1F1D", // Deep warm black background: "#2E3440", // Nord Polar Night 0 (darkest)
surface: "#252926", // Warm dark gray surface: "#3B4252", // Nord Polar Night 1 (medium dark)
surfaceElevated: "#2D3330", // Elevated warm dark surfaceElevated: "#434C5E", // Nord Polar Night 2 (lighter)
// Text // Text (Snow Storm palette)
textPrimary: "#E8E6E1", // Warm off-white textPrimary: "#ECEFF4", // Nord Snow Storm 3 (lightest)
textSecondary: "#B8BFB5", // Medium warm gray textSecondary: "#E5E9F0", // Nord Snow Storm 2
textTertiary: "#7A8379", // Muted warm gray textTertiary: "#D8DEE9", // Nord Snow Storm 1
// Borders // Borders
border: "#3A3F3C", // Subtle dark border border: "#434C5E", // Nord Polar Night 2
borderLight: "#2F3432", // Ultra subtle borderLight: "#3B4252", // Nord Polar Night 1
// Overlays // Overlays
overlay: "rgba(0, 0, 0, 0.6)", overlay: "rgba(0, 0, 0, 0.6)",
overlayLight: "rgba(255, 255, 255, 0.05)", overlayLight: "rgba(236, 239, 244, 0.05)", // Snow Storm 3
// Legacy // Legacy
white: "#E8E6E1", white: "#ECEFF4",
black: "#1C1F1D", black: "#2E3440",
}; };
/** /**