Orient
See how #015E85 looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* Orient Base */
--color-primary: #015E85;
--color-primary-rgb: 1 94 133;
--color-primary-hsl: 198 99% 26%;
/* Foreground text color based on contrast */
--color-primary-foreground: #ffffff;
/* Shades */
--color-primary-50: #e6f7ff;
--color-primary-100: #b3e8ff;
--color-primary-200: #80d8fe;
--color-primary-300: #4dc9fe;
--color-primary-400: #1bbafe;
--color-primary-500: #01a0e4;
--color-primary-600: #017db2;
--color-primary-700: #01597f;
--color-primary-800: #00354c;
--color-primary-900: #001219;
}