Aarhusian Sky

CSS

:root {
  --aarhusian-sky: #1150af;
  --aarhusian-sky-rgb: 17 80 175;
  --aarhusian-sky-oklch: oklch(0.454 0.164 259.5);
}

.element {
  color: var(--aarhusian-sky);
  background-color: hsl(216 82% 38%);
  border-color: oklch(0.454 0.164 259.5);
}

Tailwind CSS v4

@theme {
  --color-aarhusian-sky: #1150af;
  --color-aarhusian-sky-50: #dbf6ff;
  --color-aarhusian-sky-100: #cae9ff;
  --color-aarhusian-sky-200: #add5ff;
  --color-aarhusian-sky-300: #88b7ff;
  --color-aarhusian-sky-400: #619dfe;
  --color-aarhusian-sky-500: #3d82f0;
  --color-aarhusian-sky-600: #356ecb;
  --color-aarhusian-sky-700: #2a58a3;
  --color-aarhusian-sky-800: #19417a;
  --color-aarhusian-sky-900: #102d56;
  --color-aarhusian-sky-950: #03193a;
}

SCSS

$aarhusian-sky: #1150af;
$aarhusian-sky-rgb: 17, 80, 175;
$aarhusian-sky-light: mix(#fff, $aarhusian-sky, 20%);
$aarhusian-sky-dark: mix(#000, $aarhusian-sky, 20%);

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