Dash of Oregano

CSS

:root {
  --dash-of-oregano: #928459;
  --dash-of-oregano-rgb: 146 132 89;
  --dash-of-oregano-oklch: oklch(0.615 0.062 92.1);
}

.element {
  color: var(--dash-of-oregano);
  background-color: hsl(45 24% 46%);
  border-color: oklch(0.615 0.062 92.1);
}

Tailwind CSS v4

@theme {
  --color-dash-of-oregano: #928459;
  --color-dash-of-oregano-50: #fbf5e2;
  --color-dash-of-oregano-100: #eee8d1;
  --color-dash-of-oregano-200: #ddd4b7;
  --color-dash-of-oregano-300: #c2b794;
  --color-dash-of-oregano-400: #ab9e74;
  --color-dash-of-oregano-500: #958555;
  --color-dash-of-oregano-600: #7e7149;
  --color-dash-of-oregano-700: #655a3a;
  --color-dash-of-oregano-800: #4b4229;
  --color-dash-of-oregano-900: #342d1b;
  --color-dash-of-oregano-950: #1f1a0c;
}

SCSS

$dash-of-oregano: #928459;
$dash-of-oregano-rgb: 146, 132, 89;
$dash-of-oregano-light: mix(#fff, $dash-of-oregano, 20%);
$dash-of-oregano-dark: mix(#000, $dash-of-oregano, 20%);

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