Pale Parsnip

CSS

:root {
  --pale-parsnip: #e3d8bf;
  --pale-parsnip-rgb: 227 216 191;
  --pale-parsnip-oklch: oklch(0.884 0.036 87.1);
}

.element {
  color: var(--pale-parsnip);
  background-color: hsl(42 39% 82%);
  border-color: oklch(0.884 0.036 87.1);
}

Tailwind CSS v4

@theme {
  --color-pale-parsnip: #e3d8bf;
  --color-pale-parsnip-50: #f9f5ea;
  --color-pale-parsnip-100: #ece8db;
  --color-pale-parsnip-200: #dad4c4;
  --color-pale-parsnip-300: #bfb7a3;
  --color-pale-parsnip-400: #a79e87;
  --color-pale-parsnip-500: #90856c;
  --color-pale-parsnip-600: #7a715b;
  --color-pale-parsnip-700: #625a49;
  --color-pale-parsnip-800: #484234;
  --color-pale-parsnip-900: #322d24;
  --color-pale-parsnip-950: #1e1a13;
}

SCSS

$pale-parsnip: #e3d8bf;
$pale-parsnip-rgb: 227, 216, 191;
$pale-parsnip-light: mix(#fff, $pale-parsnip, 20%);
$pale-parsnip-dark: mix(#000, $pale-parsnip, 20%);

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