#D7C499

CSS

:root {
  --prairie-land: #d7c499;
  --prairie-land-rgb: 215 196 153;
  --prairie-land-oklch: oklch(0.826 0.061 86.9);
}

.element {
  color: var(--prairie-land);
  background-color: hsl(42 44% 72%);
  border-color: oklch(0.826 0.061 86.9);
}

Tailwind CSS v4

@theme {
  --color-prairie-land: #d7c499;
  --color-prairie-land-50: #fcf5e2;
  --color-prairie-land-100: #f0e7d1;
  --color-prairie-land-200: #dfd3b7;
  --color-prairie-land-300: #c4b694;
  --color-prairie-land-400: #ae9d75;
  --color-prairie-land-500: #988456;
  --color-prairie-land-600: #80704a;
  --color-prairie-land-700: #67593b;
  --color-prairie-land-800: #4c412a;
  --color-prairie-land-900: #352d1c;
  --color-prairie-land-950: #201a0c;
}

SCSS

$prairie-land: #d7c499;
$prairie-land-rgb: 215, 196, 153;
$prairie-land-light: mix(#fff, $prairie-land, 20%);
$prairie-land-dark: mix(#000, $prairie-land, 20%);

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