#B53513

CSS

:root {
  --once-bitten: #b53513;
  --once-bitten-rgb: 181 53 19;
  --once-bitten-oklch: oklch(0.518 0.17 34.8);
}

.element {
  color: var(--once-bitten);
  background-color: hsl(13 81% 39%);
  border-color: oklch(0.518 0.17 34.8);
}

Tailwind CSS v4

@theme {
  --color-once-bitten: #b53513;
  --color-once-bitten-50: #ffe5d3;
  --color-once-bitten-100: #ffd5c0;
  --color-once-bitten-200: #ffbaa1;
  --color-once-bitten-300: #ff9678;
  --color-once-bitten-400: #f17455;
  --color-once-bitten-500: #e04f2b;
  --color-once-bitten-600: #bd4426;
  --color-once-bitten-700: #98361e;
  --color-once-bitten-800: #722617;
  --color-once-bitten-900: #50190f;
  --color-once-bitten-950: #350903;
}

SCSS

$once-bitten: #b53513;
$once-bitten-rgb: 181, 53, 19;
$once-bitten-light: mix(#fff, $once-bitten, 20%);
$once-bitten-dark: mix(#000, $once-bitten, 20%);

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