Thousand Years Green

CSS

:root {
  --thousand-years-green: #316745;
  --thousand-years-green-rgb: 49 103 69;
  --thousand-years-green-oklch: oklch(0.467 0.08 154.2);
}

.element {
  color: var(--thousand-years-green);
  background-color: hsl(142 36% 30%);
  border-color: oklch(0.467 0.08 154.2);
}

Tailwind CSS v4

@theme {
  --color-thousand-years-green: #316745;
  --color-thousand-years-green-50: #e4fdec;
  --color-thousand-years-green-100: #d3f0dd;
  --color-thousand-years-green-200: #b9dfc6;
  --color-thousand-years-green-300: #96c4a7;
  --color-thousand-years-green-400: #78ad89;
  --color-thousand-years-green-500: #59966e;
  --color-thousand-years-green-600: #4c7f5d;
  --color-thousand-years-green-700: #3c664a;
  --color-thousand-years-green-800: #2c4a35;
  --color-thousand-years-green-900: #1e3424;
  --color-thousand-years-green-950: #0d1f13;
}

SCSS

$thousand-years-green: #316745;
$thousand-years-green-rgb: 49, 103, 69;
$thousand-years-green-light: mix(#fff, $thousand-years-green, 20%);
$thousand-years-green-dark: mix(#000, $thousand-years-green, 20%);

.element {
  color: $thousand-years-green;
  box-shadow: 0 0 0 2px rgba($thousand-years-green, 0.35);
}