Bitter Dandelion

CSS

:root {
  --bitter-dandelion: #6ecb3c;
  --bitter-dandelion-rgb: 110 203 60;
  --bitter-dandelion-oklch: oklch(0.757 0.197 136.8);
}

.element {
  color: var(--bitter-dandelion);
  background-color: hsl(99 58% 52%);
  border-color: oklch(0.757 0.197 136.8);
}

Tailwind CSS v4

@theme {
  --color-bitter-dandelion: #6ecb3c;
  --color-bitter-dandelion-50: #d9ffcd;
  --color-bitter-dandelion-100: #c7f8b9;
  --color-bitter-dandelion-200: #a9e996;
  --color-bitter-dandelion-300: #80cf68;
  --color-bitter-dandelion-400: #60b730;
  --color-bitter-dandelion-500: #37a100;
  --color-bitter-dandelion-600: #308800;
  --color-bitter-dandelion-700: #276d00;
  --color-bitter-dandelion-800: #1f5000;
  --color-bitter-dandelion-900: #153800;
  --color-bitter-dandelion-950: #062200;
}

SCSS

$bitter-dandelion: #6ecb3c;
$bitter-dandelion-rgb: 110, 203, 60;
$bitter-dandelion-light: mix(#fff, $bitter-dandelion, 20%);
$bitter-dandelion-dark: mix(#000, $bitter-dandelion, 20%);

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