#8DA433

CSS

:root {
  --guardian-of-gardens: #8da433;
  --guardian-of-gardens-rgb: 141 164 51;
  --guardian-of-gardens-oklch: oklch(0.679 0.139 120.2);
}

.element {
  color: var(--guardian-of-gardens);
  background-color: hsl(72 53% 42%);
  border-color: oklch(0.679 0.139 120.2);
}

Tailwind CSS v4

@theme {
  --color-guardian-of-gardens: #8da433;
  --color-guardian-of-gardens-50: #eefcd0;
  --color-guardian-of-gardens-100: #e0f0bd;
  --color-guardian-of-gardens-200: #cade9c;
  --color-guardian-of-gardens-300: #abc370;
  --color-guardian-of-gardens-400: #94aa42;
  --color-guardian-of-gardens-500: #7b9200;
  --color-guardian-of-gardens-600: #687c00;
  --color-guardian-of-gardens-700: #536301;
  --color-guardian-of-gardens-800: #3e4800;
  --color-guardian-of-gardens-900: #2b3200;
  --color-guardian-of-gardens-950: #181e00;
}

SCSS

$guardian-of-gardens: #8da433;
$guardian-of-gardens-rgb: 141, 164, 51;
$guardian-of-gardens-light: mix(#fff, $guardian-of-gardens, 20%);
$guardian-of-gardens-dark: mix(#000, $guardian-of-gardens, 20%);

.element {
  color: $guardian-of-gardens;
  box-shadow: 0 0 0 2px rgba($guardian-of-gardens, 0.35);
}