Dark Blackberry

CSS

:root {
  --dark-blackberry: #533958;
  --dark-blackberry-rgb: 83 57 88;
  --dark-blackberry-oklch: oklch(0.387 0.061 320.9);
}

.element {
  color: var(--dark-blackberry);
  background-color: hsl(290 21% 28%);
  border-color: oklch(0.387 0.061 320.9);
}

Tailwind CSS v4

@theme {
  --color-dark-blackberry: #533958;
  --color-dark-blackberry-50: #fef0ff;
  --color-dark-blackberry-100: #f2e1f4;
  --color-dark-blackberry-200: #e1cce4;
  --color-dark-blackberry-300: #c7adca;
  --color-dark-blackberry-400: #af93b5;
  --color-dark-blackberry-500: #99799f;
  --color-dark-blackberry-600: #816786;
  --color-dark-blackberry-700: #68526c;
  --color-dark-blackberry-800: #4c3c50;
  --color-dark-blackberry-900: #352938;
  --color-dark-blackberry-950: #201722;
}

SCSS

$dark-blackberry: #533958;
$dark-blackberry-rgb: 83, 57, 88;
$dark-blackberry-light: mix(#fff, $dark-blackberry, 20%);
$dark-blackberry-dark: mix(#000, $dark-blackberry, 20%);

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