My Pink
See how #D69188 looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* My Pink Base */
--color-primary: #D69188;
--color-primary-rgb: 214 145 136;
--color-primary-hsl: 7 49% 69%;
/* Foreground text color based on contrast */
--color-primary-foreground: #000000;
/* Shades */
--color-primary-50: #f8edec;
--color-primary-100: #ebcac6;
--color-primary-200: #dea7a0;
--color-primary-300: #d1847a;
--color-primary-400: #c46154;
--color-primary-500: #ab483b;
--color-primary-600: #85382e;
--color-primary-700: #5f2821;
--color-primary-800: #391814;
--color-primary-900: #130807;
}