Cerignola Olive

CSS

:root {
  --cerignola-olive: #997b00;
  --cerignola-olive-rgb: 153 123 0;
  --cerignola-olive-oklch: oklch(0.594 0.122 91.6);
}

.element {
  color: var(--cerignola-olive);
  background-color: hsl(48 100% 30%);
  border-color: oklch(0.594 0.122 91.6);
}

Tailwind CSS v4

@theme {
  --color-cerignola-olive: #997b00;
  --color-cerignola-olive-50: #fff5ce;
  --color-cerignola-olive-100: #f5e8ba;
  --color-cerignola-olive-200: #e5d499;
  --color-cerignola-olive-300: #ccb66c;
  --color-cerignola-olive-400: #b99c3f;
  --color-cerignola-olive-500: #a48200;
  --color-cerignola-olive-600: #8a6e00;
  --color-cerignola-olive-700: #6f5800;
  --color-cerignola-olive-800: #534000;
  --color-cerignola-olive-900: #3a2c01;
  --color-cerignola-olive-950: #241900;
}

SCSS

$cerignola-olive: #997b00;
$cerignola-olive-rgb: 153, 123, 0;
$cerignola-olive-light: mix(#fff, $cerignola-olive, 20%);
$cerignola-olive-dark: mix(#000, $cerignola-olive, 20%);

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