#005989

CSS

:root {
  --beyond-the-sea: #005989;
  --beyond-the-sea-rgb: 0 89 137;
  --beyond-the-sea-oklch: oklch(0.445 0.106 242.3);
}

.element {
  color: var(--beyond-the-sea);
  background-color: hsl(201 100% 27%);
  border-color: oklch(0.445 0.106 242.3);
}

Tailwind CSS v4

@theme {
  --color-beyond-the-sea: #005989;
  --color-beyond-the-sea-50: #ddf9ff;
  --color-beyond-the-sea-100: #cbedff;
  --color-beyond-the-sea-200: #aedaff;
  --color-beyond-the-sea-300: #88beea;
  --color-beyond-the-sea-400: #63a6d8;
  --color-beyond-the-sea-500: #3b8dc6;
  --color-beyond-the-sea-600: #3478a7;
  --color-beyond-the-sea-700: #296086;
  --color-beyond-the-sea-800: #1a4763;
  --color-beyond-the-sea-900: #113146;
  --color-beyond-the-sea-950: #031d2d;
}

SCSS

$beyond-the-sea: #005989;
$beyond-the-sea-rgb: 0, 89, 137;
$beyond-the-sea-light: mix(#fff, $beyond-the-sea, 20%);
$beyond-the-sea-dark: mix(#000, $beyond-the-sea, 20%);

.element {
  color: $beyond-the-sea;
  box-shadow: 0 0 0 2px rgba($beyond-the-sea, 0.35);
}