In for the Night

CSS

:root {
  --in-for-the-night: #d2c4a9;
  --in-for-the-night-rgb: 210 196 169;
  --in-for-the-night-oklch: oklch(0.825 0.04 83.8);
}

.element {
  color: var(--in-for-the-night);
  background-color: hsl(40 31% 74%);
  border-color: oklch(0.825 0.04 83.8);
}

Tailwind CSS v4

@theme {
  --color-in-for-the-night: #d2c4a9;
  --color-in-for-the-night-50: #faf5e9;
  --color-in-for-the-night-100: #eee7d9;
  --color-in-for-the-night-200: #dcd3c2;
  --color-in-for-the-night-300: #c0b6a1;
  --color-in-for-the-night-400: #aa9d84;
  --color-in-for-the-night-500: #938468;
  --color-in-for-the-night-600: #7c7059;
  --color-in-for-the-night-700: #635a47;
  --color-in-for-the-night-800: #494133;
  --color-in-for-the-night-900: #332d23;
  --color-in-for-the-night-950: #1f1a12;
}

SCSS

$in-for-the-night: #d2c4a9;
$in-for-the-night-rgb: 210, 196, 169;
$in-for-the-night-light: mix(#fff, $in-for-the-night, 20%);
$in-for-the-night-dark: mix(#000, $in-for-the-night, 20%);

.element {
  color: $in-for-the-night;
  box-shadow: 0 0 0 2px rgba($in-for-the-night, 0.35);
}