Dark Everglade

CSS

:root {
  --dark-everglade: #3e554f;
  --dark-everglade-rgb: 62 85 79;
  --dark-everglade-oklch: oklch(0.429 0.03 177);
}

.element {
  color: var(--dark-everglade);
  background-color: hsl(164 16% 29%);
  border-color: oklch(0.429 0.03 177);
}

Tailwind CSS v4

@theme {
  --color-dark-everglade: #3e554f;
  --color-dark-everglade-50: #edf8f5;
  --color-dark-everglade-100: #deebe8;
  --color-dark-everglade-200: #c7d9d4;
  --color-dark-everglade-300: #a8bdb7;
  --color-dark-everglade-400: #8da59e;
  --color-dark-everglade-500: #728d86;
  --color-dark-everglade-600: #617771;
  --color-dark-everglade-700: #4d5f5a;
  --color-dark-everglade-800: #384642;
  --color-dark-everglade-900: #26302d;
  --color-dark-everglade-950: #151d1a;
}

SCSS

$dark-everglade: #3e554f;
$dark-everglade-rgb: 62, 85, 79;
$dark-everglade-light: mix(#fff, $dark-everglade, 20%);
$dark-everglade-dark: mix(#000, $dark-everglade, 20%);

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