Sushi
See how #87AB39 looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* Sushi Base */
--color-primary: #87AB39;
--color-primary-rgb: 135 171 57;
--color-primary-hsl: 79 50% 45%;
/* Foreground text color based on contrast */
--color-primary-foreground: #000000;
/* Shades */
--color-primary-50: #f5f9ec;
--color-primary-100: #e0ecc6;
--color-primary-200: #cbdf9f;
--color-primary-300: #b6d279;
--color-primary-400: #a1c653;
--color-primary-500: #88ac39;
--color-primary-600: #6a862d;
--color-primary-700: #4b6020;
--color-primary-800: #2d3913;
--color-primary-900: #0f1306;
}