Warm Air of Debonair

CSS

:root {
  --warm-air-of-debonair: #654740;
  --warm-air-of-debonair-rgb: 101 71 64;
  --warm-air-of-debonair-oklch: oklch(0.429 0.043 33.6);
}

.element {
  color: var(--warm-air-of-debonair);
  background-color: hsl(11 22% 32%);
  border-color: oklch(0.429 0.043 33.6);
}

Tailwind CSS v4

@theme {
  --color-warm-air-of-debonair: #654740;
  --color-warm-air-of-debonair-50: #fff1ed;
  --color-warm-air-of-debonair-100: #f6e3de;
  --color-warm-air-of-debonair-200: #e6cec8;
  --color-warm-air-of-debonair-300: #ccb0a9;
  --color-warm-air-of-debonair-400: #b6968e;
  --color-warm-air-of-debonair-500: #a17c74;
  --color-warm-air-of-debonair-600: #886962;
  --color-warm-air-of-debonair-700: #6d544e;
  --color-warm-air-of-debonair-800: #503d39;
  --color-warm-air-of-debonair-900: #382a27;
  --color-warm-air-of-debonair-950: #221815;
}

SCSS

$warm-air-of-debonair: #654740;
$warm-air-of-debonair-rgb: 101, 71, 64;
$warm-air-of-debonair-light: mix(#fff, $warm-air-of-debonair, 20%);
$warm-air-of-debonair-dark: mix(#000, $warm-air-of-debonair, 20%);

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