Garden Salt Green

CSS

:root {
  --garden-salt-green: #a18b62;
  --garden-salt-green-rgb: 161 139 98;
  --garden-salt-green-oklch: oklch(0.647 0.063 82.6);
}

.element {
  color: var(--garden-salt-green);
  background-color: hsl(39 25% 51%);
  border-color: oklch(0.647 0.063 82.6);
}

Tailwind CSS v4

@theme {
  --color-garden-salt-green: #a18b62;
  --color-garden-salt-green-50: #fef4e1;
  --color-garden-salt-green-100: #f2e7d1;
  --color-garden-salt-green-200: #e1d3b7;
  --color-garden-salt-green-300: #c6b593;
  --color-garden-salt-green-400: #b19b74;
  --color-garden-salt-green-500: #9b8355;
  --color-garden-salt-green-600: #836f49;
  --color-garden-salt-green-700: #69583a;
  --color-garden-salt-green-800: #4e4029;
  --color-garden-salt-green-900: #362c1b;
  --color-garden-salt-green-950: #21190c;
}

SCSS

$garden-salt-green: #a18b62;
$garden-salt-green-rgb: 161, 139, 98;
$garden-salt-green-light: mix(#fff, $garden-salt-green, 20%);
$garden-salt-green-dark: mix(#000, $garden-salt-green, 20%);

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