Islamic Green

CSS

:root {
  --islamic-green: #009900;
  --islamic-green-rgb: 0 153 0;
  --islamic-green-oklch: oklch(0.592 0.201 142.5);
}

.element {
  color: var(--islamic-green);
  background-color: hsl(120 100% 30%);
  border-color: oklch(0.592 0.201 142.5);
}

Tailwind CSS v4

@theme {
  --color-islamic-green: #009900;
  --color-islamic-green-50: #d2ffd2;
  --color-islamic-green-100: #bffabe;
  --color-islamic-green-200: #9deb9d;
  --color-islamic-green-300: #6fd273;
  --color-islamic-green-400: #47bb41;
  --color-islamic-green-500: #00a400;
  --color-islamic-green-600: #008b00;
  --color-islamic-green-700: #006f00;
  --color-islamic-green-800: #095200;
  --color-islamic-green-900: #073900;
  --color-islamic-green-950: #002300;
}

SCSS

$islamic-green: #009900;
$islamic-green-rgb: 0, 153, 0;
$islamic-green-light: mix(#fff, $islamic-green, 20%);
$islamic-green-dark: mix(#000, $islamic-green, 20%);

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