Whiskey and Wine

CSS

:root {
  --whiskey-and-wine: #49463f;
  --whiskey-and-wine-rgb: 73 70 63;
  --whiskey-and-wine-oklch: oklch(0.395 0.012 87.5);
}

.element {
  color: var(--whiskey-and-wine);
  background-color: hsl(42 7% 27%);
  border-color: oklch(0.395 0.012 87.5);
}

Tailwind CSS v4

@theme {
  --color-whiskey-and-wine: #49463f;
  --color-whiskey-and-wine-50: #f6f5f1;
  --color-whiskey-and-wine-100: #e9e8e3;
  --color-whiskey-and-wine-200: #d6d4ce;
  --color-whiskey-and-wine-300: #bab7b0;
  --color-whiskey-and-wine-400: #a19e96;
  --color-whiskey-and-wine-500: #89867d;
  --color-whiskey-and-wine-600: #74716a;
  --color-whiskey-and-wine-700: #5d5b55;
  --color-whiskey-and-wine-800: #44423e;
  --color-whiskey-and-wine-900: #2f2e2a;
  --color-whiskey-and-wine-950: #1c1a18;
}

SCSS

$whiskey-and-wine: #49463f;
$whiskey-and-wine-rgb: 73, 70, 63;
$whiskey-and-wine-light: mix(#fff, $whiskey-and-wine, 20%);
$whiskey-and-wine-dark: mix(#000, $whiskey-and-wine, 20%);

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