Sultry Smoke

CSS

:root {
  --sultry-smoke: #73696f;
  --sultry-smoke-rgb: 115 105 111;
  --sultry-smoke-oklch: oklch(0.532 0.015 340.9);
}

.element {
  color: var(--sultry-smoke);
  background-color: hsl(324 5% 43%);
  border-color: oklch(0.532 0.015 340.9);
}

Tailwind CSS v4

@theme {
  --color-sultry-smoke: #73696f;
  --color-sultry-smoke-50: #f8f3f6;
  --color-sultry-smoke-100: #ece6e9;
  --color-sultry-smoke-200: #d9d2d6;
  --color-sultry-smoke-300: #bdb4b9;
  --color-sultry-smoke-400: #a59ba1;
  --color-sultry-smoke-500: #8e8289;
  --color-sultry-smoke-600: #786e74;
  --color-sultry-smoke-700: #60585d;
  --color-sultry-smoke-800: #464044;
  --color-sultry-smoke-900: #312c2f;
  --color-sultry-smoke-950: #1d191c;
}

SCSS

$sultry-smoke: #73696f;
$sultry-smoke-rgb: 115, 105, 111;
$sultry-smoke-light: mix(#fff, $sultry-smoke, 20%);
$sultry-smoke-dark: mix(#000, $sultry-smoke, 20%);

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