Morning Glory
See how #9EDEE0 looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* Morning Glory Base */
--color-primary: #9EDEE0;
--color-primary-rgb: 158 222 224;
--color-primary-hsl: 182 52% 75%;
/* Foreground text color based on contrast */
--color-primary-foreground: #000000;
/* Shades */
--color-primary-50: #ecf8f9;
--color-primary-100: #c5ebed;
--color-primary-200: #9edee0;
--color-primary-300: #77d1d4;
--color-primary-400: #51c4c8;
--color-primary-500: #37aaae;
--color-primary-600: #2b8588;
--color-primary-700: #1f5f61;
--color-primary-800: #12393a;
--color-primary-900: #061313;
}