Anubis Black

CSS

:root {
  --anubis-black: #312231;
  --anubis-black-rgb: 49 34 49;
  --anubis-black-oklch: oklch(0.276 0.034 326.5);
}

.element {
  color: var(--anubis-black);
  background-color: hsl(300 18% 16%);
  border-color: oklch(0.276 0.034 326.5);
}

Tailwind CSS v4

@theme {
  --color-anubis-black: #312231;
  --color-anubis-black-50: #fbf2fa;
  --color-anubis-black-100: #efe4ee;
  --color-anubis-black-200: #ddcfdc;
  --color-anubis-black-300: #c2b1c0;
  --color-anubis-black-400: #aa98a9;
  --color-anubis-black-500: #937f92;
  --color-anubis-black-600: #7c6b7c;
  --color-anubis-black-700: #635663;
  --color-anubis-black-800: #493e49;
  --color-anubis-black-900: #322b33;
  --color-anubis-black-950: #1e181e;
}

SCSS

$anubis-black: #312231;
$anubis-black-rgb: 49, 34, 49;
$anubis-black-light: mix(#fff, $anubis-black, 20%);
$anubis-black-dark: mix(#000, $anubis-black, 20%);

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