Entan Red

CSS

:root {
  --entan-red: #ec6d51;
  --entan-red-rgb: 236 109 81;
  --entan-red-oklch: oklch(0.683 0.163 33.9);
}

.element {
  color: var(--entan-red);
  background-color: hsl(11 80% 62%);
  border-color: oklch(0.683 0.163 33.9);
}

Tailwind CSS v4

@theme {
  --color-entan-red: #ec6d51;
  --color-entan-red-50: #ffe6d5;
  --color-entan-red-100: #ffd5c3;
  --color-entan-red-200: #ffbba4;
  --color-entan-red-300: #ff987c;
  --color-entan-red-400: #ef765b;
  --color-entan-red-500: #dd5234;
  --color-entan-red-600: #ba462d;
  --color-entan-red-700: #963824;
  --color-entan-red-800: #70271b;
  --color-entan-red-900: #4f1a11;
  --color-entan-red-950: #340a04;
}

SCSS

$entan-red: #ec6d51;
$entan-red-rgb: 236, 109, 81;
$entan-red-light: mix(#fff, $entan-red, 20%);
$entan-red-dark: mix(#000, $entan-red, 20%);

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