El Salva
See how #8F3E33 looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* El Salva Base */
--color-primary: #8F3E33;
--color-primary-rgb: 143 62 51;
--color-primary-hsl: 7 47% 38%;
/* Foreground text color based on contrast */
--color-primary-foreground: #ffffff;
/* Shades */
--color-primary-50: #f8eeec;
--color-primary-100: #ebcbc7;
--color-primary-200: #dda8a1;
--color-primary-300: #d0867c;
--color-primary-400: #c26356;
--color-primary-500: #a9493d;
--color-primary-600: #83392f;
--color-primary-700: #5e2922;
--color-primary-800: #381814;
--color-primary-900: #130807;
}