Little Black Dress

CSS

:root {
  --little-black-dress: #43484b;
  --little-black-dress-rgb: 67 72 75;
  --little-black-dress-oklch: oklch(0.398 0.008 233.8);
}

.element {
  color: var(--little-black-dress);
  background-color: hsl(203 6% 28%);
  border-color: oklch(0.398 0.008 233.8);
}

Tailwind CSS v4

@theme {
  --color-little-black-dress: #43484b;
  --color-little-black-dress-50: #f3f5f7;
  --color-little-black-dress-100: #e5e8ea;
  --color-little-black-dress-200: #d1d5d7;
  --color-little-black-dress-300: #b3b8bb;
  --color-little-black-dress-400: #9a9fa3;
  --color-little-black-dress-500: #81878b;
  --color-little-black-dress-600: #6d7275;
  --color-little-black-dress-700: #575b5e;
  --color-little-black-dress-800: #404345;
  --color-little-black-dress-900: #2c2e30;
  --color-little-black-dress-950: #191b1c;
}

SCSS

$little-black-dress: #43484b;
$little-black-dress-rgb: 67, 72, 75;
$little-black-dress-light: mix(#fff, $little-black-dress, 20%);
$little-black-dress-dark: mix(#000, $little-black-dress, 20%);

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