#36A2A6

CSS

:root {
  --baltic: #36a2a6;
  --baltic-rgb: 54 162 166;
  --baltic-oklch: oklch(0.654 0.096 198.6);
}

.element {
  color: var(--baltic);
  background-color: hsl(182 51% 43%);
  border-color: oklch(0.654 0.096 198.6);
}

Tailwind CSS v4

@theme {
  --color-baltic: #36a2a6;
  --color-baltic-50: #d6feff;
  --color-baltic-100: #c4f2f5;
  --color-baltic-200: #a4e1e5;
  --color-baltic-300: #79c7cb;
  --color-baltic-400: #4eb0b3;
  --color-baltic-500: #02999e;
  --color-baltic-600: #0e8185;
  --color-baltic-700: #0d686b;
  --color-baltic-800: #074c4d;
  --color-baltic-900: #053536;
  --color-baltic-950: #002021;
}

SCSS

$baltic: #36a2a6;
$baltic-rgb: 54, 162, 166;
$baltic-light: mix(#fff, $baltic, 20%);
$baltic-dark: mix(#000, $baltic, 20%);

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