Paradise of Greenery

CSS

:root {
  --paradise-of-greenery: #398749;
  --paradise-of-greenery-rgb: 57 135 73;
  --paradise-of-greenery-oklch: oklch(0.559 0.122 148);
}

.element {
  color: var(--paradise-of-greenery);
  background-color: hsl(132 41% 38%);
  border-color: oklch(0.559 0.122 148);
}

Tailwind CSS v4

@theme {
  --color-paradise-of-greenery: #398749;
  --color-paradise-of-greenery-50: #deffe3;
  --color-paradise-of-greenery-100: #ccf4d3;
  --color-paradise-of-greenery-200: #b0e4b9;
  --color-paradise-of-greenery-300: #89c996;
  --color-paradise-of-greenery-400: #69b275;
  --color-paradise-of-greenery-500: #449c56;
  --color-paradise-of-greenery-600: #3b8449;
  --color-paradise-of-greenery-700: #2f693a;
  --color-paradise-of-greenery-800: #234d27;
  --color-paradise-of-greenery-900: #17361a;
  --color-paradise-of-greenery-950: #08210b;
}

SCSS

$paradise-of-greenery: #398749;
$paradise-of-greenery-rgb: 57, 135, 73;
$paradise-of-greenery-light: mix(#fff, $paradise-of-greenery, 20%);
$paradise-of-greenery-dark: mix(#000, $paradise-of-greenery, 20%);

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