Pink Flamingo
See how #FC67FA looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* Pink Flamingo Base */
--color-primary: #FC67FA;
--color-primary-rgb: 252 103 250;
--color-primary-hsl: 301 96% 70%;
/* Foreground text color based on contrast */
--color-primary-foreground: #000000;
/* Shades */
--color-primary-50: #fee6fe;
--color-primary-100: #fdb4fc;
--color-primary-200: #fc82fa;
--color-primary-300: #fb50f9;
--color-primary-400: #fa1ef7;
--color-primary-500: #e105dd;
--color-primary-600: #af04ac;
--color-primary-700: #7d037b;
--color-primary-800: #4b024a;
--color-primary-900: #190119;
}