#CE6B54

CSS

:root {
  --track-and-field: #ce6b54;
  --track-and-field-rgb: 206 107 84;
  --track-and-field-oklch: oklch(0.638 0.131 34.2);
}

.element {
  color: var(--track-and-field);
  background-color: hsl(11 55% 57%);
  border-color: oklch(0.638 0.131 34.2);
}

Tailwind CSS v4

@theme {
  --color-track-and-field: #ce6b54;
  --color-track-and-field-50: #ffe9dc;
  --color-track-and-field-100: #ffd9ca;
  --color-track-and-field-200: #ffc1ae;
  --color-track-and-field-300: #f29f88;
  --color-track-and-field-400: #e08069;
  --color-track-and-field-500: #ce6148;
  --color-track-and-field-600: #ae533e;
  --color-track-and-field-700: #8c4231;
  --color-track-and-field-800: #682f24;
  --color-track-and-field-900: #492018;
  --color-track-and-field-950: #300f09;
}

SCSS

$track-and-field: #ce6b54;
$track-and-field-rgb: 206, 107, 84;
$track-and-field-light: mix(#fff, $track-and-field, 20%);
$track-and-field-dark: mix(#000, $track-and-field, 20%);

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