#EA8C76

CSS

:root {
  --lox: #ea8c76;
  --lox-rgb: 234 140 118;
  --lox-oklch: oklch(0.734 0.12 34);
}

.element {
  color: var(--lox);
  background-color: hsl(11 73% 69%);
  border-color: oklch(0.734 0.12 34);
}

Tailwind CSS v4

@theme {
  --color-lox: #ea8c76;
  --color-lox-50: #ffeade;
  --color-lox-100: #ffdbcd;
  --color-lox-200: #ffc3b1;
  --color-lox-300: #eda28d;
  --color-lox-400: #db836f;
  --color-lox-500: #c8654f;
  --color-lox-600: #a95643;
  --color-lox-700: #884535;
  --color-lox-800: #653127;
  --color-lox-900: #47211a;
  --color-lox-950: #2e100b;
}

SCSS

$lox: #ea8c76;
$lox-rgb: 234, 140, 118;
$lox-light: mix(#fff, $lox, 20%);
$lox-dark: mix(#000, $lox, 20%);

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