Cinnamon Milk

CSS

:root {
  --cinnamon-milk: #ebdab5;
  --cinnamon-milk-rgb: 235 218 181;
  --cinnamon-milk-oklch: oklch(0.893 0.052 86.2);
}

.element {
  color: var(--cinnamon-milk);
  background-color: hsl(41 57% 82%);
  border-color: oklch(0.893 0.052 86.2);
}

Tailwind CSS v4

@theme {
  --color-cinnamon-milk: #ebdab5;
  --color-cinnamon-milk-50: #fbf5e5;
  --color-cinnamon-milk-100: #efe7d5;
  --color-cinnamon-milk-200: #ddd4bc;
  --color-cinnamon-milk-300: #c2b69a;
  --color-cinnamon-milk-400: #ac9d7b;
  --color-cinnamon-milk-500: #96845e;
  --color-cinnamon-milk-600: #7e7050;
  --color-cinnamon-milk-700: #655940;
  --color-cinnamon-milk-800: #4b412d;
  --color-cinnamon-milk-900: #342d1f;
  --color-cinnamon-milk-950: #1f1a0e;
}

SCSS

$cinnamon-milk: #ebdab5;
$cinnamon-milk-rgb: 235, 218, 181;
$cinnamon-milk-light: mix(#fff, $cinnamon-milk, 20%);
$cinnamon-milk-dark: mix(#000, $cinnamon-milk, 20%);

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