Last of Lettuce

CSS

:root {
  --last-of-lettuce: #aadd66;
  --last-of-lettuce-rgb: 170 221 102;
  --last-of-lettuce-oklch: oklch(0.837 0.158 128.7);
}

.element {
  color: var(--last-of-lettuce);
  background-color: hsl(86 64% 63%);
  border-color: oklch(0.837 0.158 128.7);
}

Tailwind CSS v4

@theme {
  --color-last-of-lettuce: #aadd66;
  --color-last-of-lettuce-50: #e6ffd0;
  --color-last-of-lettuce-100: #d6f3bc;
  --color-last-of-lettuce-200: #bde39b;
  --color-last-of-lettuce-300: #9bc86f;
  --color-last-of-lettuce-400: #82b03f;
  --color-last-of-lettuce-500: #659800;
  --color-last-of-lettuce-600: #568100;
  --color-last-of-lettuce-700: #456700;
  --color-last-of-lettuce-800: #344b00;
  --color-last-of-lettuce-900: #233400;
  --color-last-of-lettuce-950: #122000;
}

SCSS

$last-of-lettuce: #aadd66;
$last-of-lettuce-rgb: 170, 221, 102;
$last-of-lettuce-light: mix(#fff, $last-of-lettuce, 20%);
$last-of-lettuce-dark: mix(#000, $last-of-lettuce, 20%);

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