Curry

CSS

:root {
  --curry: #d6a332;
  --curry-rgb: 214 163 50;
  --curry-oklch: oklch(0.744 0.137 82.9);
}

.element {
  color: var(--curry);
  background-color: hsl(41 67% 52%);
  border-color: oklch(0.744 0.137 82.9);
}

Tailwind CSS v4

@theme {
  --color-curry: #d6a332;
  --color-curry-50: #fff3c9;
  --color-curry-100: #fde5b4;
  --color-curry-200: #efd090;
  --color-curry-300: #d8b260;
  --color-curry-400: #c6962b;
  --color-curry-500: #b27b00;
  --color-curry-600: #966800;
  --color-curry-700: #785300;
  --color-curry-800: #5a3c00;
  --color-curry-900: #3f2900;
  --color-curry-950: #281700;
}

SCSS

$curry: #d6a332;
$curry-rgb: 214, 163, 50;
$curry-light: mix(#fff, $curry, 20%);
$curry-dark: mix(#000, $curry, 20%);

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