Gǎn Lǎn Huáng Olive

CSS

:root {
  --gan-lan-huang-olive: #c9ff27;
  --gan-lan-huang-olive-rgb: 201 255 39;
  --gan-lan-huang-olive-oklch: oklch(0.929 0.223 124.1);
}

.element {
  color: var(--gan-lan-huang-olive);
  background-color: hsl(75 100% 58%);
  border-color: oklch(0.929 0.223 124.1);
}

Tailwind CSS v4

@theme {
  --color-gan-lan-huang-olive: #c9ff27;
  --color-gan-lan-huang-olive-50: #e5ffbc;
  --color-gan-lan-huang-olive-100: #d5f6a3;
  --color-gan-lan-huang-olive-200: #bce577;
  --color-gan-lan-huang-olive-300: #9bcb36;
  --color-gan-lan-huang-olive-400: #84b200;
  --color-gan-lan-huang-olive-500: #689a00;
  --color-gan-lan-huang-olive-600: #598200;
  --color-gan-lan-huang-olive-700: #476800;
  --color-gan-lan-huang-olive-800: #364c00;
  --color-gan-lan-huang-olive-900: #253500;
  --color-gan-lan-huang-olive-950: #142000;
}

SCSS

$gan-lan-huang-olive: #c9ff27;
$gan-lan-huang-olive-rgb: 201, 255, 39;
$gan-lan-huang-olive-light: mix(#fff, $gan-lan-huang-olive, 20%);
$gan-lan-huang-olive-dark: mix(#000, $gan-lan-huang-olive, 20%);

.element {
  color: $gan-lan-huang-olive;
  box-shadow: 0 0 0 2px rgba($gan-lan-huang-olive, 0.35);
}