Ash Pink

CSS

:root {
  --ash-pink: #998e91;
  --ash-pink-rgb: 153 142 145;
  --ash-pink-oklch: oklch(0.657 0.014 359);
}

.element {
  color: var(--ash-pink);
  background-color: hsl(344 5% 58%);
  border-color: oklch(0.657 0.014 359);
}

Tailwind CSS v4

@theme {
  --color-ash-pink: #998e91;
  --color-ash-pink-50: #f9f3f5;
  --color-ash-pink-100: #ece6e7;
  --color-ash-pink-200: #dad2d4;
  --color-ash-pink-300: #beb5b7;
  --color-ash-pink-400: #a69b9e;
  --color-ash-pink-500: #8e8386;
  --color-ash-pink-600: #786f71;
  --color-ash-pink-700: #60585b;
  --color-ash-pink-800: #474042;
  --color-ash-pink-900: #312c2e;
  --color-ash-pink-950: #1d191b;
}

SCSS

$ash-pink: #998e91;
$ash-pink-rgb: 153, 142, 145;
$ash-pink-light: mix(#fff, $ash-pink, 20%);
$ash-pink-dark: mix(#000, $ash-pink, 20%);

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