#86CCB7

CSS

:root {
  --bevelled-glass: #86ccb7;
  --bevelled-glass-rgb: 134 204 183;
  --bevelled-glass-oklch: oklch(0.793 0.077 173.4);
}

.element {
  color: var(--bevelled-glass);
  background-color: hsl(162 41% 66%);
  border-color: oklch(0.793 0.077 173.4);
}

Tailwind CSS v4

@theme {
  --color-bevelled-glass: #86ccb7;
  --color-bevelled-glass-50: #dffdf4;
  --color-bevelled-glass-100: #cef1e6;
  --color-bevelled-glass-200: #b3e0d2;
  --color-bevelled-glass-300: #8ec5b5;
  --color-bevelled-glass-400: #6cae9a;
  --color-bevelled-glass-500: #489782;
  --color-bevelled-glass-600: #3e806e;
  --color-bevelled-glass-700: #326658;
  --color-bevelled-glass-800: #234b3f;
  --color-bevelled-glass-900: #18342b;
  --color-bevelled-glass-950: #081f19;
}

SCSS

$bevelled-glass: #86ccb7;
$bevelled-glass-rgb: 134, 204, 183;
$bevelled-glass-light: mix(#fff, $bevelled-glass, 20%);
$bevelled-glass-dark: mix(#000, $bevelled-glass, 20%);

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