#3C4E63

CSS

:root {
  --into-the-stratosphere: #3c4e63;
  --into-the-stratosphere-rgb: 60 78 99;
  --into-the-stratosphere-oklch: oklch(0.418 0.042 252.7);
}

.element {
  color: var(--into-the-stratosphere);
  background-color: hsl(212 25% 31%);
  border-color: oklch(0.418 0.042 252.7);
}

Tailwind CSS v4

@theme {
  --color-into-the-stratosphere: #3c4e63;
  --color-into-the-stratosphere-50: #edf6ff;
  --color-into-the-stratosphere-100: #dfe9f6;
  --color-into-the-stratosphere-200: #c8d6e6;
  --color-into-the-stratosphere-300: #a9b9cd;
  --color-into-the-stratosphere-400: #8da0b7;
  --color-into-the-stratosphere-500: #7388a2;
  --color-into-the-stratosphere-600: #617389;
  --color-into-the-stratosphere-700: #4e5c6e;
  --color-into-the-stratosphere-800: #384451;
  --color-into-the-stratosphere-900: #262f38;
  --color-into-the-stratosphere-950: #141b23;
}

SCSS

$into-the-stratosphere: #3c4e63;
$into-the-stratosphere-rgb: 60, 78, 99;
$into-the-stratosphere-light: mix(#fff, $into-the-stratosphere, 20%);
$into-the-stratosphere-dark: mix(#000, $into-the-stratosphere, 20%);

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