#A9714F

CSS

:root {
  --pecan: #a9714f;
  --pecan-rgb: 169 113 79;
  --pecan-oklch: oklch(0.599 0.086 51.7);
}

.element {
  color: var(--pecan);
  background-color: hsl(23 36% 49%);
  border-color: oklch(0.599 0.086 51.7);
}

Tailwind CSS v4

@theme {
  --color-pecan: #a9714f;
  --color-pecan-50: #ffefdf;
  --color-pecan-100: #ffe1ce;
  --color-pecan-200: #f3cbb2;
  --color-pecan-300: #dbac8e;
  --color-pecan-400: #c8906f;
  --color-pecan-500: #b3754f;
  --color-pecan-600: #986344;
  --color-pecan-700: #7a4f36;
  --color-pecan-800: #5a3927;
  --color-pecan-900: #3f271a;
  --color-pecan-950: #28150a;
}

SCSS

$pecan: #a9714f;
$pecan-rgb: 169, 113, 79;
$pecan-light: mix(#fff, $pecan, 20%);
$pecan-dark: mix(#000, $pecan, 20%);

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