Burnt Ash

CSS

:root {
  --burnt-ash: #746572;
  --burnt-ash-rgb: 116 101 114;
  --burnt-ash-oklch: oklch(0.525 0.027 330.3);
}

.element {
  color: var(--burnt-ash);
  background-color: hsl(308 7% 43%);
  border-color: oklch(0.525 0.027 330.3);
}

Tailwind CSS v4

@theme {
  --color-burnt-ash: #746572;
  --color-burnt-ash-50: #faf2f9;
  --color-burnt-ash-100: #eee5ec;
  --color-burnt-ash-200: #dcd0d9;
  --color-burnt-ash-300: #c0b2be;
  --color-burnt-ash-400: #a899a6;
  --color-burnt-ash-500: #91808f;
  --color-burnt-ash-600: #7b6c79;
  --color-burnt-ash-700: #625761;
  --color-burnt-ash-800: #483f47;
  --color-burnt-ash-900: #322b31;
  --color-burnt-ash-950: #1e191d;
}

SCSS

$burnt-ash: #746572;
$burnt-ash-rgb: 116, 101, 114;
$burnt-ash-light: mix(#fff, $burnt-ash, 20%);
$burnt-ash-dark: mix(#000, $burnt-ash, 20%);

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