Sell Gold

CSS

:root {
  --sell-gold: #d4ae5e;
  --sell-gold-rgb: 212 174 94;
  --sell-gold-oklch: oklch(0.768 0.108 84.3);
}

.element {
  color: var(--sell-gold);
  background-color: hsl(41 58% 60%);
  border-color: oklch(0.768 0.108 84.3);
}

Tailwind CSS v4

@theme {
  --color-sell-gold: #d4ae5e;
  --color-sell-gold-50: #fff4d3;
  --color-sell-gold-100: #f8e6bf;
  --color-sell-gold-200: #e9d29f;
  --color-sell-gold-300: #d0b476;
  --color-sell-gold-400: #bc994e;
  --color-sell-gold-500: #a87f1b;
  --color-sell-gold-600: #8e6c1a;
  --color-sell-gold-700: #715615;
  --color-sell-gold-800: #553e0d;
  --color-sell-gold-900: #3b2b08;
  --color-sell-gold-950: #251800;
}

SCSS

$sell-gold: #d4ae5e;
$sell-gold-rgb: 212, 174, 94;
$sell-gold-light: mix(#fff, $sell-gold, 20%);
$sell-gold-dark: mix(#000, $sell-gold, 20%);

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