Pale Cashmere

CSS

:root {
  --pale-cashmere: #e8dfd5;
  --pale-cashmere-rgb: 232 223 213;
  --pale-cashmere-oklch: oklch(0.908 0.017 70.5);
}

.element {
  color: var(--pale-cashmere);
  background-color: hsl(32 29% 87%);
  border-color: oklch(0.908 0.017 70.5);
}

Tailwind CSS v4

@theme {
  --color-pale-cashmere: #e8dfd5;
  --color-pale-cashmere-50: #f8f4f0;
  --color-pale-cashmere-100: #ebe7e2;
  --color-pale-cashmere-200: #d9d3cd;
  --color-pale-cashmere-300: #bdb6ae;
  --color-pale-cashmere-400: #a59d94;
  --color-pale-cashmere-500: #8d857a;
  --color-pale-cashmere-600: #787068;
  --color-pale-cashmere-700: #605a53;
  --color-pale-cashmere-800: #46413c;
  --color-pale-cashmere-900: #312d29;
  --color-pale-cashmere-950: #1d1a17;
}

SCSS

$pale-cashmere: #e8dfd5;
$pale-cashmere-rgb: 232, 223, 213;
$pale-cashmere-light: mix(#fff, $pale-cashmere, 20%);
$pale-cashmere-dark: mix(#000, $pale-cashmere, 20%);

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