#E67897

CSS

:root {
  --embarrassed: #e67897;
  --embarrassed-rgb: 230 120 151;
  --embarrassed-oklch: oklch(0.705 0.139 3.4);
}

.element {
  color: var(--embarrassed);
  background-color: hsl(343 69% 69%);
  border-color: oklch(0.705 0.139 3.4);
}

Tailwind CSS v4

@theme {
  --color-embarrassed: #e67897;
  --color-embarrassed-50: #ffe5ef;
  --color-embarrassed-100: #ffd5e1;
  --color-embarrassed-200: #ffbccc;
  --color-embarrassed-300: #f499ad;
  --color-embarrassed-400: #e17996;
  --color-embarrassed-500: #ce587d;
  --color-embarrassed-600: #ae4b69;
  --color-embarrassed-700: #8c3c54;
  --color-embarrassed-800: #682b3f;
  --color-embarrassed-900: #491d2b;
  --color-embarrassed-950: #300c19;
}

SCSS

$embarrassed: #e67897;
$embarrassed-rgb: 230, 120, 151;
$embarrassed-light: mix(#fff, $embarrassed, 20%);
$embarrassed-dark: mix(#000, $embarrassed, 20%);

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