Earth Black

CSS

:root {
  --earth-black: #49433b;
  --earth-black-rgb: 73 67 59;
  --earth-black-oklch: oklch(0.386 0.016 75.2);
}

.element {
  color: var(--earth-black);
  background-color: hsl(34 11% 26%);
  border-color: oklch(0.386 0.016 75.2);
}

Tailwind CSS v4

@theme {
  --color-earth-black: #49433b;
  --color-earth-black-50: #f8f5f0;
  --color-earth-black-100: #ebe7e2;
  --color-earth-black-200: #d8d3cd;
  --color-earth-black-300: #bcb6af;
  --color-earth-black-400: #a49d95;
  --color-earth-black-500: #8c857b;
  --color-earth-black-600: #777168;
  --color-earth-black-700: #5f5a53;
  --color-earth-black-800: #46423d;
  --color-earth-black-900: #302d2a;
  --color-earth-black-950: #1c1a17;
}

SCSS

$earth-black: #49433b;
$earth-black-rgb: 73, 67, 59;
$earth-black-light: mix(#fff, $earth-black, 20%);
$earth-black-dark: mix(#000, $earth-black, 20%);

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