#7BCDDE

CSS

:root {
  --summer-of-82: #7bcdde;
  --summer-of-82-rgb: 123 205 222;
  --summer-of-82-oklch: oklch(0.802 0.083 212.4);
}

.element {
  color: var(--summer-of-82);
  background-color: hsl(190 60% 68%);
  border-color: oklch(0.802 0.083 212.4);
}

Tailwind CSS v4

@theme {
  --color-summer-of-82: #7bcdde;
  --color-summer-of-82-50: #dbfcff;
  --color-summer-of-82-100: #c9f0f9;
  --color-summer-of-82-200: #acdeea;
  --color-summer-of-82-300: #85c3d2;
  --color-summer-of-82-400: #5facbb;
  --color-summer-of-82-500: #3395a7;
  --color-summer-of-82-600: #2e7e8d;
  --color-summer-of-82-700: #246571;
  --color-summer-of-82-800: #184a52;
  --color-summer-of-82-900: #0f3339;
  --color-summer-of-82-950: #021f24;
}

SCSS

$summer-of-82: #7bcdde;
$summer-of-82-rgb: 123, 205, 222;
$summer-of-82-light: mix(#fff, $summer-of-82, 20%);
$summer-of-82-dark: mix(#000, $summer-of-82, 20%);

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