Hippie Pink
See how #AE4560 looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* Hippie Pink Base */
--color-primary: #AE4560;
--color-primary-rgb: 174 69 96;
--color-primary-hsl: 345 43% 48%;
/* Foreground text color based on contrast */
--color-primary-foreground: #ffffff;
/* Shades */
--color-primary-50: #f8edf0;
--color-primary-100: #e9c8d1;
--color-primary-200: #dba4b2;
--color-primary-300: #cc7f93;
--color-primary-400: #be5b74;
--color-primary-500: #a4415a;
--color-primary-600: #803346;
--color-primary-700: #5b2432;
--color-primary-800: #37161e;
--color-primary-900: #12070a;
}