Dried Tobacco

CSS

:root {
  --dried-tobacco: #a0883b;
  --dried-tobacco-rgb: 160 136 59;
  --dried-tobacco-oklch: oklch(0.633 0.1 92);
}

.element {
  color: var(--dried-tobacco);
  background-color: hsl(46 46% 43%);
  border-color: oklch(0.633 0.1 92);
}

Tailwind CSS v4

@theme {
  --color-dried-tobacco: #a0883b;
  --color-dried-tobacco-50: #fef5d5;
  --color-dried-tobacco-100: #f3e8c3;
  --color-dried-tobacco-200: #e2d4a4;
  --color-dried-tobacco-300: #c8b77b;
  --color-dried-tobacco-400: #b49d55;
  --color-dried-tobacco-500: #9e832a;
  --color-dried-tobacco-600: #866f25;
  --color-dried-tobacco-700: #6b591e;
  --color-dried-tobacco-800: #504113;
  --color-dried-tobacco-900: #382c0c;
  --color-dried-tobacco-950: #221901;
}

SCSS

$dried-tobacco: #a0883b;
$dried-tobacco-rgb: 160, 136, 59;
$dried-tobacco-light: mix(#fff, $dried-tobacco, 20%);
$dried-tobacco-dark: mix(#000, $dried-tobacco, 20%);

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