Serengeti Sand

CSS

:root {
  --serengeti-sand: #fce7d0;
  --serengeti-sand-rgb: 252 231 208;
  --serengeti-sand-oklch: oklch(0.939 0.038 69.9);
}

.element {
  color: var(--serengeti-sand);
  background-color: hsl(31 88% 90%);
  border-color: oklch(0.939 0.038 69.9);
}

Tailwind CSS v4

@theme {
  --color-serengeti-sand: #fce7d0;
  --color-serengeti-sand-50: #fcf4ea;
  --color-serengeti-sand-100: #f0e6da;
  --color-serengeti-sand-200: #dfd2c3;
  --color-serengeti-sand-300: #c4b5a3;
  --color-serengeti-sand-400: #ad9b87;
  --color-serengeti-sand-500: #97826b;
  --color-serengeti-sand-600: #806e5b;
  --color-serengeti-sand-700: #665848;
  --color-serengeti-sand-800: #4b4034;
  --color-serengeti-sand-900: #342c24;
  --color-serengeti-sand-950: #201913;
}

SCSS

$serengeti-sand: #fce7d0;
$serengeti-sand-rgb: 252, 231, 208;
$serengeti-sand-light: mix(#fff, $serengeti-sand, 20%);
$serengeti-sand-dark: mix(#000, $serengeti-sand, 20%);

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