Red Grey

CSS

:root {
  --red-grey: #99686a;
  --red-grey-rgb: 153 104 106;
  --red-grey-oklch: oklch(0.569 0.063 16.6);
}

.element {
  color: var(--red-grey);
  background-color: hsl(358 19% 50%);
  border-color: oklch(0.569 0.063 16.6);
}

Tailwind CSS v4

@theme {
  --color-red-grey: #99686a;
  --color-red-grey-50: #ffeeee;
  --color-red-grey-100: #fde0e0;
  --color-red-grey-200: #eecaca;
  --color-red-grey-300: #d6abab;
  --color-red-grey-400: #c19091;
  --color-red-grey-500: #ac7577;
  --color-red-grey-600: #916365;
  --color-red-grey-700: #754f51;
  --color-red-grey-800: #56393b;
  --color-red-grey-900: #3c2729;
  --color-red-grey-950: #261517;
}

SCSS

$red-grey: #99686a;
$red-grey-rgb: 153, 104, 106;
$red-grey-light: mix(#fff, $red-grey, 20%);
$red-grey-dark: mix(#000, $red-grey, 20%);

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