Hunting Boots

CSS

:root {
  --hunting-boots: #6b5a54;
  --hunting-boots-rgb: 107 90 84;
  --hunting-boots-oklch: oklch(0.483 0.024 40.4);
}

.element {
  color: var(--hunting-boots);
  background-color: hsl(16 12% 37%);
  border-color: oklch(0.483 0.024 40.4);
}

Tailwind CSS v4

@theme {
  --color-hunting-boots: #6b5a54;
  --color-hunting-boots-50: #fcf3f0;
  --color-hunting-boots-100: #efe5e2;
  --color-hunting-boots-200: #ded1cc;
  --color-hunting-boots-300: #c3b4ae;
  --color-hunting-boots-400: #ac9a94;
  --color-hunting-boots-500: #95817a;
  --color-hunting-boots-600: #7e6d67;
  --color-hunting-boots-700: #655753;
  --color-hunting-boots-800: #4a403c;
  --color-hunting-boots-900: #342c29;
  --color-hunting-boots-950: #1f1917;
}

SCSS

$hunting-boots: #6b5a54;
$hunting-boots-rgb: 107, 90, 84;
$hunting-boots-light: mix(#fff, $hunting-boots, 20%);
$hunting-boots-dark: mix(#000, $hunting-boots, 20%);

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