Army Canvas

CSS

:root {
  --army-canvas: #5b6f61;
  --army-canvas-rgb: 91 111 97;
  --army-canvas-oklch: oklch(0.521 0.032 154.6);
}

.element {
  color: var(--army-canvas);
  background-color: hsl(138 10% 40%);
  border-color: oklch(0.521 0.032 154.6);
}

Tailwind CSS v4

@theme {
  --color-army-canvas: #5b6f61;
  --color-army-canvas-50: #eef8f1;
  --color-army-canvas-100: #e0ebe3;
  --color-army-canvas-200: #cad9cf;
  --color-army-canvas-300: #abbdb1;
  --color-army-canvas-400: #90a496;
  --color-army-canvas-500: #768d7d;
  --color-army-canvas-600: #64776a;
  --color-army-canvas-700: #505f54;
  --color-army-canvas-800: #3a463d;
  --color-army-canvas-900: #28302a;
  --color-army-canvas-950: #161d18;
}

SCSS

$army-canvas: #5b6f61;
$army-canvas-rgb: 91, 111, 97;
$army-canvas-light: mix(#fff, $army-canvas, 20%);
$army-canvas-dark: mix(#000, $army-canvas, 20%);

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