#919165

CSS

:root {
  --paid-in-full: #919165;
  --paid-in-full-rgb: 145 145 101;
  --paid-in-full-oklch: oklch(0.645 0.061 108);
}

.element {
  color: var(--paid-in-full);
  background-color: hsl(60 18% 48%);
  border-color: oklch(0.645 0.061 108);
}

Tailwind CSS v4

@theme {
  --color-paid-in-full: #919165;
  --color-paid-in-full-50: #f6f7e3;
  --color-paid-in-full-100: #e9ead3;
  --color-paid-in-full-200: #d5d7b9;
  --color-paid-in-full-300: #b9bb97;
  --color-paid-in-full-400: #a1a277;
  --color-paid-in-full-500: #8a8a59;
  --color-paid-in-full-600: #75744c;
  --color-paid-in-full-700: #5d5d3c;
  --color-paid-in-full-800: #45442b;
  --color-paid-in-full-900: #302f1d;
  --color-paid-in-full-950: #1c1b0d;
}

SCSS

$paid-in-full: #919165;
$paid-in-full-rgb: 145, 145, 101;
$paid-in-full-light: mix(#fff, $paid-in-full, 20%);
$paid-in-full-dark: mix(#000, $paid-in-full, 20%);

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