Patient White

CSS

:root {
  --patient-white: #ede2de;
  --patient-white-rgb: 237 226 222;
  --patient-white-oklch: oklch(0.92 0.013 41.2);
}

.element {
  color: var(--patient-white);
  background-color: hsl(16 29% 90%);
  border-color: oklch(0.92 0.013 41.2);
}

Tailwind CSS v4

@theme {
  --color-patient-white: #ede2de;
  --color-patient-white-50: #f9f4f2;
  --color-patient-white-100: #ece6e4;
  --color-patient-white-200: #d9d2d0;
  --color-patient-white-300: #beb5b2;
  --color-patient-white-400: #a69c98;
  --color-patient-white-500: #8e837f;
  --color-patient-white-600: #786f6c;
  --color-patient-white-700: #605956;
  --color-patient-white-800: #47413f;
  --color-patient-white-900: #312d2b;
  --color-patient-white-950: #1d1a19;
}

SCSS

$patient-white: #ede2de;
$patient-white-rgb: 237, 226, 222;
$patient-white-light: mix(#fff, $patient-white, 20%);
$patient-white-dark: mix(#000, $patient-white, 20%);

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