Black Leather Jacket

CSS

:root {
  --black-leather-jacket: #253529;
  --black-leather-jacket-rgb: 37 53 41;
  --black-leather-jacket-oklch: oklch(0.311 0.03 152.1);
}

.element {
  color: var(--black-leather-jacket);
  background-color: hsl(135 18% 18%);
  border-color: oklch(0.311 0.03 152.1);
}

Tailwind CSS v4

@theme {
  --color-black-leather-jacket: #253529;
  --color-black-leather-jacket-50: #eff8f1;
  --color-black-leather-jacket-100: #e1ebe3;
  --color-black-leather-jacket-200: #cbd8ce;
  --color-black-leather-jacket-300: #acbcb0;
  --color-black-leather-jacket-400: #92a496;
  --color-black-leather-jacket-500: #788c7d;
  --color-black-leather-jacket-600: #667769;
  --color-black-leather-jacket-700: #515f54;
  --color-black-leather-jacket-800: #3b453d;
  --color-black-leather-jacket-900: #29302a;
  --color-black-leather-jacket-950: #161c17;
}

SCSS

$black-leather-jacket: #253529;
$black-leather-jacket-rgb: 37, 53, 41;
$black-leather-jacket-light: mix(#fff, $black-leather-jacket, 20%);
$black-leather-jacket-dark: mix(#000, $black-leather-jacket, 20%);

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