============================================================================== OPENLATDEVS BRAND COLOR PALETTE (MD3) ============================================================================== Project: Openlatdevs Code Hosting Platform (git.openlat.dev) Design System: Material Design 3 (M3) ------------------------------------------------------------------------------ 1. PRIMARY ACCENT (Openlat Sapphire / Professional Indigo) ------------------------------------------------------------------------------ - Primary Base (#4A69AE): Sobriety, trust, enterprise-grade engineering - Primary Dark (#3B548C): Hover & active states in Light mode - Primary Light (#6B87C8): Hover & active states in Dark mode - Primary Contrast (#FFFFFF in Light / #0E1217 in Dark) ------------------------------------------------------------------------------ 2. SECONDARY ACCENT (Muted Slate Teal) ------------------------------------------------------------------------------ - Secondary Base (#3E6B74): Badges, tabs, secondary action buttons - Secondary Light (#568792): Border highlights & active indicators ------------------------------------------------------------------------------ 3. INK DARK MODE (Obsidian Night Surface) ------------------------------------------------------------------------------ - Body Canvas (#0E1217): Ultra-deep Ink Obsidian background - Header / Navbar (#12171E): Dark navbar with subtle border - Card / Box Header (#1E2530): Elevated surface for box headers - Card / Box Body (#161B23): Deep surface for content boxes - Text Primary (#F1F5F9): High-contrast crisp Slate-100 text - Text Muted (#94A3B8): Slate-400 secondary typography - Border Subtle (#2E3646): Fine slate border dividers ------------------------------------------------------------------------------ 4. MATERIAL LIGHT MODE (Clean Snow & Ice) ------------------------------------------------------------------------------ - Body Canvas (#F8FAFC): Soft Slate-50 background - Header / Navbar (#0E1217): Elegant contrasted Ink navbar - Card / Box Header (#F1F5F9): Slate-100 box headers - Card / Box Body (#FFFFFF): Pure White crisp card containers - Text Primary (#0F172A): Deep Slate-900 typography - Text Muted (#475569): Slate-600 secondary typography - Border Subtle (#E2E8F0): Slate-200 dividers ------------------------------------------------------------------------------ 5. FUNCTIONAL STATUS COLORS ------------------------------------------------------------------------------ - Success Green: #10B981 (Emerald) - Warning Yellow: #F59E0B (Amber) - Danger Red: #EF4444 (Crimson) - Info Blue: #3B82F6 (Azure) ==============================================================================