True to You

CSS

:root {
  --true-to-you: #cdd3a3;
  --true-to-you-rgb: 205 211 163;
  --true-to-you-oklch: oklch(0.85 0.064 113.6);
}

.element {
  color: var(--true-to-you);
  background-color: hsl(67 35% 73%);
  border-color: oklch(0.85 0.064 113.6);
}

Tailwind CSS v4

@theme {
  --color-true-to-you: #cdd3a3;
  --color-true-to-you-50: #f4f8e3;
  --color-true-to-you-100: #e6ebd3;
  --color-true-to-you-200: #d3d8b9;
  --color-true-to-you-300: #b5bc97;
  --color-true-to-you-400: #9ea377;
  --color-true-to-you-500: #868b59;
  --color-true-to-you-600: #71764c;
  --color-true-to-you-700: #5a5e3c;
  --color-true-to-you-800: #43452a;
  --color-true-to-you-900: #2e2f1c;
  --color-true-to-you-950: #1b1c0d;
}

SCSS

$true-to-you: #cdd3a3;
$true-to-you-rgb: 205, 211, 163;
$true-to-you-light: mix(#fff, $true-to-you, 20%);
$true-to-you-dark: mix(#000, $true-to-you, 20%);

.element {
  color: $true-to-you;
  box-shadow: 0 0 0 2px rgba($true-to-you, 0.35);
}