#0AAE00

CSS

:root {
  --always-greener-grass: #0aae00;
  --always-greener-grass-rgb: 10 174 0;
  --always-greener-grass-oklch: oklch(0.651 0.22 142.3);
}

.element {
  color: var(--always-greener-grass);
  background-color: hsl(117 100% 34%);
  border-color: oklch(0.651 0.22 142.3);
}

Tailwind CSS v4

@theme {
  --color-always-greener-grass: #0aae00;
  --color-always-greener-grass-50: #cfffce;
  --color-always-greener-grass-100: #bafcba;
  --color-always-greener-grass-200: #97ed97;
  --color-always-greener-grass-300: #66d46a;
  --color-always-greener-grass-400: #39bd31;
  --color-always-greener-grass-500: #00a600;
  --color-always-greener-grass-600: #008d00;
  --color-always-greener-grass-700: #007100;
  --color-always-greener-grass-800: #005300;
  --color-always-greener-grass-900: #003a00;
  --color-always-greener-grass-950: #002400;
}

SCSS

$always-greener-grass: #0aae00;
$always-greener-grass-rgb: 10, 174, 0;
$always-greener-grass-light: mix(#fff, $always-greener-grass, 20%);
$always-greener-grass-dark: mix(#000, $always-greener-grass, 20%);

.element {
  color: $always-greener-grass;
  box-shadow: 0 0 0 2px rgba($always-greener-grass, 0.35);
}