Olive Pit

CSS

:root {
  --olive-pit: #a9a491;
  --olive-pit-rgb: 169 164 145;
  --olive-pit-oklch: oklch(0.718 0.027 94.8);
}

.element {
  color: var(--olive-pit);
  background-color: hsl(48 12% 62%);
  border-color: oklch(0.718 0.027 94.8);
}

Tailwind CSS v4

@theme {
  --color-olive-pit: #a9a491;
  --color-olive-pit-50: #f7f5ed;
  --color-olive-pit-100: #eae8de;
  --color-olive-pit-200: #d7d4c8;
  --color-olive-pit-300: #bbb8a8;
  --color-olive-pit-400: #a39f8d;
  --color-olive-pit-500: #8c8672;
  --color-olive-pit-600: #767261;
  --color-olive-pit-700: #5f5b4d;
  --color-olive-pit-800: #464238;
  --color-olive-pit-900: #302e26;
  --color-olive-pit-950: #1c1b15;
}

SCSS

$olive-pit: #a9a491;
$olive-pit-rgb: 169, 164, 145;
$olive-pit-light: mix(#fff, $olive-pit, 20%);
$olive-pit-dark: mix(#000, $olive-pit, 20%);

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