Cherish Is the Word

CSS

:root {
  --cherish-is-the-word: #e6e4da;
  --cherish-is-the-word-rgb: 230 228 218;
  --cherish-is-the-word-oklch: oklch(0.918 0.014 97.5);
}

.element {
  color: var(--cherish-is-the-word);
  background-color: hsl(50 19% 88%);
  border-color: oklch(0.918 0.014 97.5);
}

Tailwind CSS v4

@theme {
  --color-cherish-is-the-word: #e6e4da;
  --color-cherish-is-the-word-50: #f6f5f1;
  --color-cherish-is-the-word-100: #e9e8e3;
  --color-cherish-is-the-word-200: #d5d4ce;
  --color-cherish-is-the-word-300: #b9b8b0;
  --color-cherish-is-the-word-400: #a09f96;
  --color-cherish-is-the-word-500: #88867c;
  --color-cherish-is-the-word-600: #737269;
  --color-cherish-is-the-word-700: #5c5b54;
  --color-cherish-is-the-word-800: #44423d;
  --color-cherish-is-the-word-900: #2f2e2a;
  --color-cherish-is-the-word-950: #1b1b18;
}

SCSS

$cherish-is-the-word: #e6e4da;
$cherish-is-the-word-rgb: 230, 228, 218;
$cherish-is-the-word-light: mix(#fff, $cherish-is-the-word, 20%);
$cherish-is-the-word-dark: mix(#000, $cherish-is-the-word, 20%);

.element {
  color: $cherish-is-the-word;
  box-shadow: 0 0 0 2px rgba($cherish-is-the-word, 0.35);
}