Fall Chill

CSS

:root {
  --fall-chill: #e1dddb;
  --fall-chill-rgb: 225 221 219;
  --fall-chill-oklch: oklch(0.9 0.005 48.7);
}

.element {
  color: var(--fall-chill);
  background-color: hsl(20 9% 87%);
  border-color: oklch(0.9 0.005 48.7);
}

Tailwind CSS v4

@theme {
  --color-fall-chill: #e1dddb;
  --color-fall-chill-50: #f6f5f4;
  --color-fall-chill-100: #e9e7e6;
  --color-fall-chill-200: #d6d3d2;
  --color-fall-chill-300: #bab7b5;
  --color-fall-chill-400: #a19d9c;
  --color-fall-chill-500: #898583;
  --color-fall-chill-600: #74716f;
  --color-fall-chill-700: #5d5a59;
  --color-fall-chill-800: #444241;
  --color-fall-chill-900: #2f2d2d;
  --color-fall-chill-950: #1b1a1a;
}

SCSS

$fall-chill: #e1dddb;
$fall-chill-rgb: 225, 221, 219;
$fall-chill-light: mix(#fff, $fall-chill, 20%);
$fall-chill-dark: mix(#000, $fall-chill, 20%);

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