#282BAB

CSS

:root {
  --sapphire-splendour: #282bab;
  --sapphire-splendour-rgb: 40 43 171;
  --sapphire-splendour-oklch: oklch(0.389 0.196 271.7);
}

.element {
  color: var(--sapphire-splendour);
  background-color: hsl(239 62% 41%);
  border-color: oklch(0.389 0.196 271.7);
}

Tailwind CSS v4

@theme {
  --color-sapphire-splendour: #282bab;
  --color-sapphire-splendour-50: #e3f2ff;
  --color-sapphire-splendour-100: #d3e4ff;
  --color-sapphire-splendour-200: #baceff;
  --color-sapphire-splendour-300: #98aeff;
  --color-sapphire-splendour-400: #7792ff;
  --color-sapphire-splendour-500: #5c73ff;
  --color-sapphire-splendour-600: #4e62dc;
  --color-sapphire-splendour-700: #3e4fb1;
  --color-sapphire-splendour-800: #293a85;
  --color-sapphire-splendour-900: #1b285e;
  --color-sapphire-splendour-950: #0c1541;
}

SCSS

$sapphire-splendour: #282bab;
$sapphire-splendour-rgb: 40, 43, 171;
$sapphire-splendour-light: mix(#fff, $sapphire-splendour, 20%);
$sapphire-splendour-dark: mix(#000, $sapphire-splendour, 20%);

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