Washed Khaki

CSS

:root {
  --washed-khaki: #cac2af;
  --washed-khaki-rgb: 202 194 175;
  --washed-khaki-oklch: oklch(0.815 0.028 87.9);
}

.element {
  color: var(--washed-khaki);
  background-color: hsl(42 20% 74%);
  border-color: oklch(0.815 0.028 87.9);
}

Tailwind CSS v4

@theme {
  --color-washed-khaki: #cac2af;
  --color-washed-khaki-50: #f8f5ec;
  --color-washed-khaki-100: #ebe8de;
  --color-washed-khaki-200: #d9d4c7;
  --color-washed-khaki-300: #bdb7a8;
  --color-washed-khaki-400: #a59e8c;
  --color-washed-khaki-500: #8e8572;
  --color-washed-khaki-600: #787160;
  --color-washed-khaki-700: #605a4d;
  --color-washed-khaki-800: #474238;
  --color-washed-khaki-900: #312d26;
  --color-washed-khaki-950: #1d1a14;
}

SCSS

$washed-khaki: #cac2af;
$washed-khaki-rgb: 202, 194, 175;
$washed-khaki-light: mix(#fff, $washed-khaki, 20%);
$washed-khaki-dark: mix(#000, $washed-khaki, 20%);

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