Prairie Dog

CSS

:root {
  --prairie-dog: #937067;
  --prairie-dog-rgb: 147 112 103;
  --prairie-dog-oklch: oklch(0.577 0.047 34.9);
}

.element {
  color: var(--prairie-dog);
  background-color: hsl(12 18% 49%);
  border-color: oklch(0.577 0.047 34.9);
}

Tailwind CSS v4

@theme {
  --color-prairie-dog: #937067;
  --color-prairie-dog-50: #fff1ec;
  --color-prairie-dog-100: #f7e3dd;
  --color-prairie-dog-200: #e7cec6;
  --color-prairie-dog-300: #ceb0a7;
  --color-prairie-dog-400: #b8958c;
  --color-prairie-dog-500: #a37b71;
  --color-prairie-dog-600: #896960;
  --color-prairie-dog-700: #6e544d;
  --color-prairie-dog-800: #513d38;
  --color-prairie-dog-900: #392a26;
  --color-prairie-dog-950: #231715;
}

SCSS

$prairie-dog: #937067;
$prairie-dog-rgb: 147, 112, 103;
$prairie-dog-light: mix(#fff, $prairie-dog, 20%);
$prairie-dog-dark: mix(#000, $prairie-dog, 20%);

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