Wild Axolotl

CSS

:root {
  --wild-axolotl: #63775a;
  --wild-axolotl-rgb: 99 119 90;
  --wild-axolotl-oklch: oklch(0.545 0.05 136.1);
}

.element {
  color: var(--wild-axolotl);
  background-color: hsl(101 14% 41%);
  border-color: oklch(0.545 0.05 136.1);
}

Tailwind CSS v4

@theme {
  --color-wild-axolotl: #63775a;
  --color-wild-axolotl-50: #eef9eb;
  --color-wild-axolotl-100: #e0ecdc;
  --color-wild-axolotl-200: #cadac5;
  --color-wild-axolotl-300: #abbea5;
  --color-wild-axolotl-400: #91a688;
  --color-wild-axolotl-500: #778e6d;
  --color-wild-axolotl-600: #65785d;
  --color-wild-axolotl-700: #51604a;
  --color-wild-axolotl-800: #3b4635;
  --color-wild-axolotl-900: #293124;
  --color-wild-axolotl-950: #171d13;
}

SCSS

$wild-axolotl: #63775a;
$wild-axolotl-rgb: 99, 119, 90;
$wild-axolotl-light: mix(#fff, $wild-axolotl, 20%);
$wild-axolotl-dark: mix(#000, $wild-axolotl, 20%);

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