Touch of Tan

CSS

:root {
  --touch-of-tan: #eed9d1;
  --touch-of-tan-rgb: 238 217 209;
  --touch-of-tan-oklch: oklch(0.9 0.026 42.1);
}

.element {
  color: var(--touch-of-tan);
  background-color: hsl(17 46% 88%);
  border-color: oklch(0.9 0.026 42.1);
}

Tailwind CSS v4

@theme {
  --color-touch-of-tan: #eed9d1;
  --color-touch-of-tan-50: #fcf3ef;
  --color-touch-of-tan-100: #f0e5e1;
  --color-touch-of-tan-200: #ded1cb;
  --color-touch-of-tan-300: #c3b4ad;
  --color-touch-of-tan-400: #ad9a93;
  --color-touch-of-tan-500: #968179;
  --color-touch-of-tan-600: #7f6d67;
  --color-touch-of-tan-700: #655752;
  --color-touch-of-tan-800: #4b403c;
  --color-touch-of-tan-900: #342c29;
  --color-touch-of-tan-950: #1f1917;
}

SCSS

$touch-of-tan: #eed9d1;
$touch-of-tan-rgb: 238, 217, 209;
$touch-of-tan-light: mix(#fff, $touch-of-tan, 20%);
$touch-of-tan-dark: mix(#000, $touch-of-tan, 20%);

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