Lilac Ash

CSS

:root {
  --lilac-ash: #d7cdcd;
  --lilac-ash-rgb: 215 205 205;
  --lilac-ash-oklch: oklch(0.856 0.011 17.4);
}

.element {
  color: var(--lilac-ash);
  background-color: hsl(0 11% 82%);
  border-color: oklch(0.856 0.011 17.4);
}

Tailwind CSS v4

@theme {
  --color-lilac-ash: #d7cdcd;
  --color-lilac-ash-50: #f8f4f4;
  --color-lilac-ash-100: #ebe6e6;
  --color-lilac-ash-200: #d9d2d2;
  --color-lilac-ash-300: #bdb5b5;
  --color-lilac-ash-400: #a59c9c;
  --color-lilac-ash-500: #8d8383;
  --color-lilac-ash-600: #786f6f;
  --color-lilac-ash-700: #605959;
  --color-lilac-ash-800: #464141;
  --color-lilac-ash-900: #312d2d;
  --color-lilac-ash-950: #1d1a1a;
}

SCSS

$lilac-ash: #d7cdcd;
$lilac-ash-rgb: 215, 205, 205;
$lilac-ash-light: mix(#fff, $lilac-ash, 20%);
$lilac-ash-dark: mix(#000, $lilac-ash, 20%);

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