#68B37A

CSS

:root {
  --frog-pond: #68b37a;
  --frog-pond-rgb: 104 179 122;
  --frog-pond-oklch: oklch(0.703 0.112 150.4);
}

.element {
  color: var(--frog-pond);
  background-color: hsl(134 33% 55%);
  border-color: oklch(0.703 0.112 150.4);
}

Tailwind CSS v4

@theme {
  --color-frog-pond: #68b37a;
  --color-frog-pond-50: #deffe6;
  --color-frog-pond-100: #cdf3d6;
  --color-frog-pond-200: #b1e3bd;
  --color-frog-pond-300: #8bc89c;
  --color-frog-pond-400: #6bb17b;
  --color-frog-pond-500: #469b5d;
  --color-frog-pond-600: #3d8350;
  --color-frog-pond-700: #30693f;
  --color-frog-pond-800: #244d2c;
  --color-frog-pond-900: #18351d;
  --color-frog-pond-950: #08200d;
}

SCSS

$frog-pond: #68b37a;
$frog-pond-rgb: 104, 179, 122;
$frog-pond-light: mix(#fff, $frog-pond, 20%);
$frog-pond-dark: mix(#000, $frog-pond, 20%);

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