#86C1A5

CSS

:root {
  --celadon-porcelain: #86c1a5;
  --celadon-porcelain-rgb: 134 193 165;
  --celadon-porcelain-oklch: oklch(0.762 0.073 163.5);
}

.element {
  color: var(--celadon-porcelain);
  background-color: hsl(152 32% 64%);
  border-color: oklch(0.762 0.073 163.5);
}

Tailwind CSS v4

@theme {
  --color-celadon-porcelain: #86c1a5;
  --color-celadon-porcelain-50: #e3fcf0;
  --color-celadon-porcelain-100: #d2f0e2;
  --color-celadon-porcelain-200: #b8dfcd;
  --color-celadon-porcelain-300: #94c4ae;
  --color-celadon-porcelain-400: #75ac92;
  --color-celadon-porcelain-500: #559679;
  --color-celadon-porcelain-600: #497f66;
  --color-celadon-porcelain-700: #3a6552;
  --color-celadon-porcelain-800: #2a4a3a;
  --color-celadon-porcelain-900: #1c3428;
  --color-celadon-porcelain-950: #0c1f16;
}

SCSS

$celadon-porcelain: #86c1a5;
$celadon-porcelain-rgb: 134, 193, 165;
$celadon-porcelain-light: mix(#fff, $celadon-porcelain, 20%);
$celadon-porcelain-dark: mix(#000, $celadon-porcelain, 20%);

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