Desert Grass

CSS

:root {
  --desert-grass: #c5b686;
  --desert-grass-rgb: 197 182 134;
  --desert-grass-oklch: oklch(0.777 0.066 92.8);
}

.element {
  color: var(--desert-grass);
  background-color: hsl(46 35% 65%);
  border-color: oklch(0.777 0.066 92.8);
}

Tailwind CSS v4

@theme {
  --color-desert-grass: #c5b686;
  --color-desert-grass-50: #fbf5e0;
  --color-desert-grass-100: #efe8d0;
  --color-desert-grass-200: #ddd4b5;
  --color-desert-grass-300: #c2b891;
  --color-desert-grass-400: #ac9e71;
  --color-desert-grass-500: #958552;
  --color-desert-grass-600: #7e7146;
  --color-desert-grass-700: #655a37;
  --color-desert-grass-800: #4b4227;
  --color-desert-grass-900: #342d1a;
  --color-desert-grass-950: #1f1a0b;
}

SCSS

$desert-grass: #c5b686;
$desert-grass-rgb: 197, 182, 134;
$desert-grass-light: mix(#fff, $desert-grass, 20%);
$desert-grass-dark: mix(#000, $desert-grass, 20%);

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