Mantis
See how #76B852 looks when applied to real interface components.
Use lighter tints for backgrounds to maintain readability while keeping brand identity.
:root {
/* Mantis Base */
--color-primary: #76B852;
--color-primary-rgb: 118 184 82;
--color-primary-hsl: 99 42% 52%;
/* Foreground text color based on contrast */
--color-primary-foreground: #000000;
/* Shades */
--color-primary-50: #f1f8ed;
--color-primary-100: #d4e9c9;
--color-primary-200: #b7daa4;
--color-primary-300: #9bcb80;
--color-primary-400: #7ebc5c;
--color-primary-500: #64a343;
--color-primary-600: #4e7f34;
--color-primary-700: #385b25;
--color-primary-800: #213616;
--color-primary-900: #0b1207;
}