#E655A2

CSS

:root {
  --major-magenta: #e655a2;
  --major-magenta-rgb: 230 85 162;
  --major-magenta-oklch: oklch(0.663 0.195 350.8);
}

.element {
  color: var(--major-magenta);
  background-color: hsl(328 74% 62%);
  border-color: oklch(0.663 0.195 350.8);
}

Tailwind CSS v4

@theme {
  --color-major-magenta: #e655a2;
  --color-major-magenta-50: #ffdffa;
  --color-major-magenta-100: #ffcdee;
  --color-major-magenta-200: #ffb1dc;
  --color-major-magenta-300: #ff8ac0;
  --color-major-magenta-400: #ef66ad;
  --color-major-magenta-500: #dd3b96;
  --color-major-magenta-600: #bb347f;
  --color-major-magenta-700: #962966;
  --color-major-magenta-800: #6f1d4d;
  --color-major-magenta-900: #4f1336;
  --color-major-magenta-950: #340421;
}

SCSS

$major-magenta: #e655a2;
$major-magenta-rgb: 230, 85, 162;
$major-magenta-light: mix(#fff, $major-magenta, 20%);
$major-magenta-dark: mix(#000, $major-magenta, 20%);

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