#F7C48D

CSS

:root {
  --dusty-boots: #f7c48d;
  --dusty-boots-rgb: 247 196 141;
  --dusty-boots-oklch: oklch(0.853 0.092 68.2);
}

.element {
  color: var(--dusty-boots);
  background-color: hsl(31 87% 76%);
  border-color: oklch(0.853 0.092 68.2);
}

Tailwind CSS v4

@theme {
  --color-dusty-boots: #f7c48d;
  --color-dusty-boots-50: #fff1d9;
  --color-dusty-boots-100: #fce3c8;
  --color-dusty-boots-200: #eeceaa;
  --color-dusty-boots-300: #d6b084;
  --color-dusty-boots-400: #c29462;
  --color-dusty-boots-500: #ae7a3d;
  --color-dusty-boots-600: #936735;
  --color-dusty-boots-700: #76532a;
  --color-dusty-boots-800: #583c1d;
  --color-dusty-boots-900: #3d2913;
  --color-dusty-boots-950: #271705;
}

SCSS

$dusty-boots: #f7c48d;
$dusty-boots-rgb: 247, 196, 141;
$dusty-boots-light: mix(#fff, $dusty-boots, 20%);
$dusty-boots-dark: mix(#000, $dusty-boots, 20%);

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