#D2987B

CSS

:root {
  --beauty-and-the-beach: #d2987b;
  --beauty-and-the-beach-rgb: 210 152 123;
  --beauty-and-the-beach-oklch: oklch(0.729 0.081 47.6);
}

.element {
  color: var(--beauty-and-the-beach);
  background-color: hsl(20 49% 65%);
  border-color: oklch(0.729 0.081 47.6);
}

Tailwind CSS v4

@theme {
  --color-beauty-and-the-beach: #d2987b;
  --color-beauty-and-the-beach-50: #ffefe1;
  --color-beauty-and-the-beach-100: #ffe1d1;
  --color-beauty-and-the-beach-200: #f2cbb6;
  --color-beauty-and-the-beach-300: #daac93;
  --color-beauty-and-the-beach-400: #c79075;
  --color-beauty-and-the-beach-500: #b27556;
  --color-beauty-and-the-beach-600: #976349;
  --color-beauty-and-the-beach-700: #794f3a;
  --color-beauty-and-the-beach-800: #5a392a;
  --color-beauty-and-the-beach-900: #3f271c;
  --color-beauty-and-the-beach-950: #28150d;
}

SCSS

$beauty-and-the-beach: #d2987b;
$beauty-and-the-beach-rgb: 210, 152, 123;
$beauty-and-the-beach-light: mix(#fff, $beauty-and-the-beach, 20%);
$beauty-and-the-beach-dark: mix(#000, $beauty-and-the-beach, 20%);

.element {
  color: $beauty-and-the-beach;
  box-shadow: 0 0 0 2px rgba($beauty-and-the-beach, 0.35);
}