#AFBA5A

CSS

:root {
  --celery: #afba5a;
  --celery-rgb: 175 186 90;
  --celery-oklch: oklch(0.76 0.122 114.7);
}

.element {
  color: var(--celery);
  background-color: hsl(67 41% 54%);
  border-color: oklch(0.76 0.122 114.7);
}

Tailwind CSS v4

@theme {
  --color-celery: #afba5a;
  --color-celery-50: #f2fad3;
  --color-celery-100: #e5eec0;
  --color-celery-200: #d0dca0;
  --color-celery-300: #b3c077;
  --color-celery-400: #9da74d;
  --color-celery-500: #858f16;
  --color-celery-600: #707917;
  --color-celery-700: #5a6113;
  --color-celery-800: #434609;
  --color-celery-900: #2e3106;
  --color-celery-950: #1b1d00;
}

SCSS

$celery: #afba5a;
$celery-rgb: 175, 186, 90;
$celery-light: mix(#fff, $celery, 20%);
$celery-dark: mix(#000, $celery, 20%);

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