Steamed Salmon

CSS

:root {
  --steamed-salmon: #ee8888;
  --steamed-salmon-rgb: 238 136 136;
  --steamed-salmon-oklch: oklch(0.736 0.125 20.5);
}

.element {
  color: var(--steamed-salmon);
  background-color: hsl(0 75% 73%);
  border-color: oklch(0.736 0.125 20.5);
}

Tailwind CSS v4

@theme {
  --color-steamed-salmon: #ee8888;
  --color-steamed-salmon-50: #ffe8e5;
  --color-steamed-salmon-100: #ffd8d5;
  --color-steamed-salmon-200: #ffc0bc;
  --color-steamed-salmon-300: #f19e9a;
  --color-steamed-salmon-400: #de7f7f;
  --color-steamed-salmon-500: #cc6062;
  --color-steamed-salmon-600: #ac5253;
  --color-steamed-salmon-700: #8a4142;
  --color-steamed-salmon-800: #672e31;
  --color-steamed-salmon-900: #481f21;
  --color-steamed-salmon-950: #2f0f11;
}

SCSS

$steamed-salmon: #ee8888;
$steamed-salmon-rgb: 238, 136, 136;
$steamed-salmon-light: mix(#fff, $steamed-salmon, 20%);
$steamed-salmon-dark: mix(#000, $steamed-salmon, 20%);

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