Brownish Black

CSS

:root {
  --brownish-black: #413936;
  --brownish-black-rgb: 65 57 54;
  --brownish-black-oklch: oklch(0.352 0.012 41.7);
}

.element {
  color: var(--brownish-black);
  background-color: hsl(16 9% 23%);
  border-color: oklch(0.352 0.012 41.7);
}

Tailwind CSS v4

@theme {
  --color-brownish-black: #413936;
  --color-brownish-black-50: #f8f4f2;
  --color-brownish-black-100: #ece7e4;
  --color-brownish-black-200: #d9d3d0;
  --color-brownish-black-300: #bdb5b2;
  --color-brownish-black-400: #a59c99;
  --color-brownish-black-500: #8e8480;
  --color-brownish-black-600: #786f6c;
  --color-brownish-black-700: #605956;
  --color-brownish-black-800: #46413f;
  --color-brownish-black-900: #312d2b;
  --color-brownish-black-950: #1d1a19;
}

SCSS

$brownish-black: #413936;
$brownish-black-rgb: 65, 57, 54;
$brownish-black-light: mix(#fff, $brownish-black, 20%);
$brownish-black-dark: mix(#000, $brownish-black, 20%);

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