Reddest Red

CSS

:root {
  --reddest-red: #9b4045;
  --reddest-red-rgb: 155 64 69;
  --reddest-red-oklch: oklch(0.495 0.122 19.4);
}

.element {
  color: var(--reddest-red);
  background-color: hsl(357 42% 43%);
  border-color: oklch(0.495 0.122 19.4);
}

Tailwind CSS v4

@theme {
  --color-reddest-red: #9b4045;
  --color-reddest-red-50: #ffe8e6;
  --color-reddest-red-100: #ffd9d6;
  --color-reddest-red-200: #ffc0bd;
  --color-reddest-red-300: #ef9e9c;
  --color-reddest-red-400: #dd8081;
  --color-reddest-red-500: #ca6165;
  --color-reddest-red-600: #ab5356;
  --color-reddest-red-700: #894244;
  --color-reddest-red-800: #662f33;
  --color-reddest-red-900: #482022;
  --color-reddest-red-950: #2e0f12;
}

SCSS

$reddest-red: #9b4045;
$reddest-red-rgb: 155, 64, 69;
$reddest-red-light: mix(#fff, $reddest-red, 20%);
$reddest-red-dark: mix(#000, $reddest-red, 20%);

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