#BF0037

CSS

:root {
  --hot-cuba: #bf0037;
  --hot-cuba-rgb: 191 0 55;
  --hot-cuba-oklch: oklch(0.51 0.204 17.7);
}

.element {
  color: var(--hot-cuba);
  background-color: hsl(343 100% 37%);
  border-color: oklch(0.51 0.204 17.7);
}

Tailwind CSS v4

@theme {
  --color-hot-cuba: #bf0037;
  --color-hot-cuba-50: #ffdedd;
  --color-hot-cuba-100: #ffcdcc;
  --color-hot-cuba-200: #ffb0b0;
  --color-hot-cuba-300: #ff888c;
  --color-hot-cuba-400: #ff6070;
  --color-hot-cuba-500: #ef2c51;
  --color-hot-cuba-600: #ca2945;
  --color-hot-cuba-700: #a22137;
  --color-hot-cuba-800: #79162a;
  --color-hot-cuba-900: #560e1c;
  --color-hot-cuba-950: #39010c;
}

SCSS

$hot-cuba: #bf0037;
$hot-cuba-rgb: 191, 0, 55;
$hot-cuba-light: mix(#fff, $hot-cuba, 20%);
$hot-cuba-dark: mix(#000, $hot-cuba, 20%);

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