#402E06

CSS

:root {
  --secret-passage: #402e06;
  --secret-passage-rgb: 64 46 6;
  --secret-passage-oklch: oklch(0.314 0.059 82.6);
}

.element {
  color: var(--secret-passage);
  background-color: hsl(41 83% 14%);
  border-color: oklch(0.314 0.059 82.6);
}

Tailwind CSS v4

@theme {
  --color-secret-passage: #402e06;
  --color-secret-passage-50: #fdf4e2;
  --color-secret-passage-100: #f1e7d2;
  --color-secret-passage-200: #e0d3b8;
  --color-secret-passage-300: #c6b695;
  --color-secret-passage-400: #b09c76;
  --color-secret-passage-500: #9a8358;
  --color-secret-passage-600: #826f4b;
  --color-secret-passage-700: #68593c;
  --color-secret-passage-800: #4d402a;
  --color-secret-passage-900: #362c1d;
  --color-secret-passage-950: #21190d;
}

SCSS

$secret-passage: #402e06;
$secret-passage-rgb: 64, 46, 6;
$secret-passage-light: mix(#fff, $secret-passage, 20%);
$secret-passage-dark: mix(#000, $secret-passage, 20%);

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