Goddess of Dawn

CSS

:root {
  --goddess-of-dawn: #904c6f;
  --goddess-of-dawn-rgb: 144 76 111;
  --goddess-of-dawn-oklch: oklch(0.51 0.101 349.1);
}

.element {
  color: var(--goddess-of-dawn);
  background-color: hsl(329 31% 43%);
  border-color: oklch(0.51 0.101 349.1);
}

Tailwind CSS v4

@theme {
  --color-goddess-of-dawn: #904c6f;
  --color-goddess-of-dawn-50: #ffeaf9;
  --color-goddess-of-dawn-100: #ffdbec;
  --color-goddess-of-dawn-200: #f7c3d9;
  --color-goddess-of-dawn-300: #e0a2be;
  --color-goddess-of-dawn-400: #cc85a8;
  --color-goddess-of-dawn-500: #b76991;
  --color-goddess-of-dawn-600: #9b597a;
  --color-goddess-of-dawn-700: #7c4762;
  --color-goddess-of-dawn-800: #5c3349;
  --color-goddess-of-dawn-900: #402333;
  --color-goddess-of-dawn-950: #29121e;
}

SCSS

$goddess-of-dawn: #904c6f;
$goddess-of-dawn-rgb: 144, 76, 111;
$goddess-of-dawn-light: mix(#fff, $goddess-of-dawn, 20%);
$goddess-of-dawn-dark: mix(#000, $goddess-of-dawn, 20%);

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