Milkwort Red

CSS

:root {
  --milkwort-red: #916981;
  --milkwort-red-rgb: 145 105 129;
  --milkwort-red-oklch: oklch(0.569 0.061 342.5);
}

.element {
  color: var(--milkwort-red);
  background-color: hsl(324 16% 49%);
  border-color: oklch(0.569 0.061 342.5);
}

Tailwind CSS v4

@theme {
  --color-milkwort-red: #916981;
  --color-milkwort-red-50: #ffeff9;
  --color-milkwort-red-100: #f8e0ed;
  --color-milkwort-red-200: #e8cada;
  --color-milkwort-red-300: #cfabbf;
  --color-milkwort-red-400: #b991a8;
  --color-milkwort-red-500: #a37691;
  --color-milkwort-red-600: #8a647b;
  --color-milkwort-red-700: #6f5062;
  --color-milkwort-red-800: #513a49;
  --color-milkwort-red-900: #392832;
  --color-milkwort-red-950: #23161e;
}

SCSS

$milkwort-red: #916981;
$milkwort-red-rgb: 145, 105, 129;
$milkwort-red-light: mix(#fff, $milkwort-red, 20%);
$milkwort-red-dark: mix(#000, $milkwort-red, 20%);

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