Goblin
See how #2F7336 looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* Goblin Base */
--color-primary: #2F7336;
--color-primary-rgb: 47 115 54;
--color-primary-hsl: 126 42% 32%;
/* Foreground text color based on contrast */
--color-primary-foreground: #ffffff;
/* Shades */
--color-primary-50: #edf8ee;
--color-primary-100: #c9e9cc;
--color-primary-200: #a4daaa;
--color-primary-300: #80cb88;
--color-primary-400: #5cbc66;
--color-primary-500: #43a34c;
--color-primary-600: #347f3b;
--color-primary-700: #255b2a;
--color-primary-800: #163619;
--color-primary-900: #071208;
}