#E569E5

CSS

:root {
  --pink-orchid: #e569e5;
  --pink-orchid-rgb: 229 105 229;
  --pink-orchid-oklch: oklch(0.714 0.212 327.5);
}

.element {
  color: var(--pink-orchid);
  background-color: hsl(300 70% 65%);
  border-color: oklch(0.714 0.212 327.5);
}

Tailwind CSS v4

@theme {
  --color-pink-orchid: #e569e5;
  --color-pink-orchid-50: #ffe0ff;
  --color-pink-orchid-100: #ffcfff;
  --color-pink-orchid-200: #ffb3ff;
  --color-pink-orchid-300: #f28ceb;
  --color-pink-orchid-400: #dd69dd;
  --color-pink-orchid-500: #ca3fcc;
  --color-pink-orchid-600: #ab37ac;
  --color-pink-orchid-700: #892c8a;
  --color-pink-orchid-800: #651f69;
  --color-pink-orchid-900: #47154a;
  --color-pink-orchid-950: #2e0530;
}

SCSS

$pink-orchid: #e569e5;
$pink-orchid-rgb: 229, 105, 229;
$pink-orchid-light: mix(#fff, $pink-orchid, 20%);
$pink-orchid-dark: mix(#000, $pink-orchid, 20%);

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