#B096D4

CSS

:root {
  --violet-velvet: #b096d4;
  --violet-velvet-rgb: 176 150 212;
  --violet-velvet-oklch: oklch(0.719 0.093 303.4);
}

.element {
  color: var(--violet-velvet);
  background-color: hsl(265 42% 71%);
  border-color: oklch(0.719 0.093 303.4);
}

Tailwind CSS v4

@theme {
  --color-violet-velvet: #b096d4;
  --color-violet-velvet-50: #fbefff;
  --color-violet-velvet-100: #efe1ff;
  --color-violet-velvet-200: #ddcbf5;
  --color-violet-velvet-300: #c2acde;
  --color-violet-velvet-400: #aa91cc;
  --color-violet-velvet-500: #9376b8;
  --color-violet-velvet-600: #7c649c;
  --color-violet-velvet-700: #63507d;
  --color-violet-velvet-800: #483b5d;
  --color-violet-velvet-900: #322841;
  --color-violet-velvet-950: #1e162a;
}

SCSS

$violet-velvet: #b096d4;
$violet-velvet-rgb: 176, 150, 212;
$violet-velvet-light: mix(#fff, $violet-velvet, 20%);
$violet-velvet-dark: mix(#000, $violet-velvet, 20%);

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