Chathams Blue
See how #175579 looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* Chathams Blue Base */
--color-primary: #175579;
--color-primary-rgb: 23 85 121;
--color-primary-hsl: 202 68% 28%;
/* Foreground text color based on contrast */
--color-primary-foreground: #ffffff;
/* Shades */
--color-primary-50: #eaf5fb;
--color-primary-100: #bfe0f3;
--color-primary-200: #94cbeb;
--color-primary-300: #69b6e2;
--color-primary-400: #3ea1da;
--color-primary-500: #2588c1;
--color-primary-600: #1d6996;
--color-primary-700: #144b6b;
--color-primary-800: #0c2d40;
--color-primary-900: #040f15;
}