Persian Rose
See how #FE28A2 looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* Persian Rose Base */
--color-primary: #FE28A2;
--color-primary-rgb: 254 40 162;
--color-primary-hsl: 326 99% 58%;
/* Foreground text color based on contrast */
--color-primary-foreground: #ffffff;
/* Shades */
--color-primary-50: #ffe6f4;
--color-primary-100: #ffb3de;
--color-primary-200: #fe80c8;
--color-primary-300: #fe4db2;
--color-primary-400: #fe1b9b;
--color-primary-500: #e40182;
--color-primary-600: #b20165;
--color-primary-700: #7f0148;
--color-primary-800: #4c002b;
--color-primary-900: #19000e;
}