#6A7E2A

CSS

:root {
  --enchanted-forest: #6a7e2a;
  --enchanted-forest-rgb: 106 126 42;
  --enchanted-forest-oklch: oklch(0.559 0.112 121.6);
}

.element {
  color: var(--enchanted-forest);
  background-color: hsl(74 50% 33%);
  border-color: oklch(0.559 0.112 121.6);
}

Tailwind CSS v4

@theme {
  --color-enchanted-forest: #6a7e2a;
  --color-enchanted-forest-50: #eefbd8;
  --color-enchanted-forest-100: #e0efc6;
  --color-enchanted-forest-200: #cadda8;
  --color-enchanted-forest-300: #acc181;
  --color-enchanted-forest-400: #94a95b;
  --color-enchanted-forest-500: #7b9133;
  --color-enchanted-forest-600: #687b2d;
  --color-enchanted-forest-700: #536223;
  --color-enchanted-forest-800: #3e4816;
  --color-enchanted-forest-900: #2a320e;
  --color-enchanted-forest-950: #181e02;
}

SCSS

$enchanted-forest: #6a7e2a;
$enchanted-forest-rgb: 106, 126, 42;
$enchanted-forest-light: mix(#fff, $enchanted-forest, 20%);
$enchanted-forest-dark: mix(#000, $enchanted-forest, 20%);

.element {
  color: $enchanted-forest;
  box-shadow: 0 0 0 2px rgba($enchanted-forest, 0.35);
}