Cafe Royale
See how #6F440C looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* Cafe Royale Base */
--color-primary: #6F440C;
--color-primary-rgb: 111 68 12;
--color-primary-hsl: 34 80% 24%;
/* Foreground text color based on contrast */
--color-primary-foreground: #ffffff;
/* Shades */
--color-primary-50: #fcf4e8;
--color-primary-100: #f7ddba;
--color-primary-200: #f2c68c;
--color-primary-300: #edaf5e;
--color-primary-400: #e89830;
--color-primary-500: #cf7f17;
--color-primary-600: #a16312;
--color-primary-700: #73470d;
--color-primary-800: #452a08;
--color-primary-900: #170e03;
}