Bird’s Egg Green

CSS

:root {
  --bird-s-egg-green: #aaccb9;
  --bird-s-egg-green-rgb: 170 204 185;
  --bird-s-egg-green-oklch: oklch(0.815 0.045 160.8);
}

.element {
  color: var(--bird-s-egg-green);
  background-color: hsl(146 25% 73%);
  border-color: oklch(0.815 0.045 160.8);
}

Tailwind CSS v4

@theme {
  --color-bird-s-egg-green: #aaccb9;
  --color-bird-s-egg-green-50: #eaf9f1;
  --color-bird-s-egg-green-100: #dbede3;
  --color-bird-s-egg-green-200: #c4dbcf;
  --color-bird-s-egg-green-300: #a4bfb1;
  --color-bird-s-egg-green-400: #88a796;
  --color-bird-s-egg-green-500: #6c907c;
  --color-bird-s-egg-green-600: #5c7a69;
  --color-bird-s-egg-green-700: #496154;
  --color-bird-s-egg-green-800: #35473d;
  --color-bird-s-egg-green-900: #24312a;
  --color-bird-s-egg-green-950: #131d17;
}

SCSS

$bird-s-egg-green: #aaccb9;
$bird-s-egg-green-rgb: 170, 204, 185;
$bird-s-egg-green-light: mix(#fff, $bird-s-egg-green, 20%);
$bird-s-egg-green-dark: mix(#000, $bird-s-egg-green, 20%);

.element {
  color: $bird-s-egg-green;
  box-shadow: 0 0 0 2px rgba($bird-s-egg-green, 0.35);
}