#000090

CSS

:root {
  --midnight-in-tokyo: #000090;
  --midnight-in-tokyo-rgb: 0 0 144;
  --midnight-in-tokyo-oklch: oklch(0.295 0.205 264.1);
}

.element {
  color: var(--midnight-in-tokyo);
  background-color: hsl(240 100% 28%);
  border-color: oklch(0.295 0.205 264.1);
}

Tailwind CSS v4

@theme {
  --color-midnight-in-tokyo: #000090;
  --color-midnight-in-tokyo-50: #daf5ff;
  --color-midnight-in-tokyo-100: #c8e7ff;
  --color-midnight-in-tokyo-200: #abd2ff;
  --color-midnight-in-tokyo-300: #86b2ff;
  --color-midnight-in-tokyo-400: #5f97ff;
  --color-midnight-in-tokyo-500: #3d79ff;
  --color-midnight-in-tokyo-600: #3467e1;
  --color-midnight-in-tokyo-700: #2952b5;
  --color-midnight-in-tokyo-800: #173d88;
  --color-midnight-in-tokyo-900: #0e2a60;
  --color-midnight-in-tokyo-950: #031642;
}

SCSS

$midnight-in-tokyo: #000090;
$midnight-in-tokyo-rgb: 0, 0, 144;
$midnight-in-tokyo-light: mix(#fff, $midnight-in-tokyo, 20%);
$midnight-in-tokyo-dark: mix(#000, $midnight-in-tokyo, 20%);

.element {
  color: $midnight-in-tokyo;
  box-shadow: 0 0 0 2px rgba($midnight-in-tokyo, 0.35);
}