#385542

CSS

:root {
  --highlander: #385542;
  --highlander-rgb: 56 85 66;
  --highlander-oklch: oklch(0.42 0.047 155.1);
}

.element {
  color: var(--highlander);
  background-color: hsl(141 21% 28%);
  border-color: oklch(0.42 0.047 155.1);
}

Tailwind CSS v4

@theme {
  --color-highlander: #385542;
  --color-highlander-50: #ebf9f0;
  --color-highlander-100: #dcede2;
  --color-highlander-200: #c5dbcc;
  --color-highlander-300: #a5bfae;
  --color-highlander-400: #89a793;
  --color-highlander-500: #6e9079;
  --color-highlander-600: #5d7a66;
  --color-highlander-700: #4a6152;
  --color-highlander-800: #36473b;
  --color-highlander-900: #253128;
  --color-highlander-950: #131d16;
}

SCSS

$highlander: #385542;
$highlander-rgb: 56, 85, 66;
$highlander-light: mix(#fff, $highlander, 20%);
$highlander-dark: mix(#000, $highlander, 20%);

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