#00B4FE

CSS

:root {
  --hawaii-morning: #00b4fe;
  --hawaii-morning-rgb: 0 180 254;
  --hawaii-morning-oklch: oklch(0.729 0.159 237);
}

.element {
  color: var(--hawaii-morning);
  background-color: hsl(197 100% 50%);
  border-color: oklch(0.729 0.159 237);
}

Tailwind CSS v4

@theme {
  --color-hawaii-morning: #00b4fe;
  --color-hawaii-morning-50: #ccfdff;
  --color-hawaii-morning-100: #b7f0ff;
  --color-hawaii-morning-200: #92deff;
  --color-hawaii-morning-300: #60c2ff;
  --color-hawaii-morning-400: #0aaaf0;
  --color-hawaii-morning-500: #0091e1;
  --color-hawaii-morning-600: #007bbe;
  --color-hawaii-morning-700: #006398;
  --color-hawaii-morning-800: #004971;
  --color-hawaii-morning-900: #00334f;
  --color-hawaii-morning-950: #001e35;
}

SCSS

$hawaii-morning: #00b4fe;
$hawaii-morning-rgb: 0, 180, 254;
$hawaii-morning-light: mix(#fff, $hawaii-morning, 20%);
$hawaii-morning-dark: mix(#000, $hawaii-morning, 20%);

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