Hospital Green

CSS

:root {
  --hospital-green: #9be5aa;
  --hospital-green-rgb: 155 229 170;
  --hospital-green-oklch: oklch(0.858 0.11 149.9);
}

.element {
  color: var(--hospital-green);
  background-color: hsl(132 59% 75%);
  border-color: oklch(0.858 0.11 149.9);
}

Tailwind CSS v4

@theme {
  --color-hospital-green: #9be5aa;
  --color-hospital-green-50: #dfffe6;
  --color-hospital-green-100: #cef3d6;
  --color-hospital-green-200: #b2e2bd;
  --color-hospital-green-300: #8cc89c;
  --color-hospital-green-400: #6db17b;
  --color-hospital-green-500: #499a5e;
  --color-hospital-green-600: #3f8250;
  --color-hospital-green-700: #326840;
  --color-hospital-green-800: #254d2c;
  --color-hospital-green-900: #19351d;
  --color-hospital-green-950: #09200d;
}

SCSS

$hospital-green: #9be5aa;
$hospital-green-rgb: 155, 229, 170;
$hospital-green-light: mix(#fff, $hospital-green, 20%);
$hospital-green-dark: mix(#000, $hospital-green, 20%);

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