#005683

CSS

:root {
  --beyond-the-sea: #005683;
  --beyond-the-sea-rgb: 0 86 131;
  --beyond-the-sea-oklch: oklch(0.433 0.102 241.4);
}

.element {
  color: var(--beyond-the-sea);
  background-color: hsl(201 100% 26%);
  border-color: oklch(0.433 0.102 241.4);
}

Tailwind CSS v4

@theme {
  --color-beyond-the-sea: #005683;
  --color-beyond-the-sea-50: #ddf9ff;
  --color-beyond-the-sea-100: #ccedff;
  --color-beyond-the-sea-200: #afdafd;
  --color-beyond-the-sea-300: #8abee8;
  --color-beyond-the-sea-400: #65a6d5;
  --color-beyond-the-sea-500: #3e8ec3;
  --color-beyond-the-sea-600: #3678a5;
  --color-beyond-the-sea-700: #2b6084;
  --color-beyond-the-sea-800: #1c4762;
  --color-beyond-the-sea-900: #123145;
  --color-beyond-the-sea-950: #041d2c;
}

SCSS

$beyond-the-sea: #005683;
$beyond-the-sea-rgb: 0, 86, 131;
$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);
}