University of Tennessee Orange

CSS

:root {
  --university-of-tennessee-orange: #f77f00;
  --university-of-tennessee-orange-rgb: 247 127 0;
  --university-of-tennessee-orange-oklch: oklch(0.719 0.179 54.4);
}

.element {
  color: var(--university-of-tennessee-orange);
  background-color: hsl(31 100% 48%);
  border-color: oklch(0.719 0.179 54.4);
}

Tailwind CSS v4

@theme {
  --color-university-of-tennessee-orange: #f77f00;
  --color-university-of-tennessee-orange-50: #ffe9c4;
  --color-university-of-tennessee-orange-100: #ffd9ae;
  --color-university-of-tennessee-orange-200: #ffc087;
  --color-university-of-tennessee-orange-300: #fc9d54;
  --color-university-of-tennessee-orange-400: #ed7c11;
  --color-university-of-tennessee-orange-500: #db5900;
  --color-university-of-tennessee-orange-600: #b94c00;
  --color-university-of-tennessee-orange-700: #953d00;
  --color-university-of-tennessee-orange-800: #702a00;
  --color-university-of-tennessee-orange-900: #4f1d00;
  --color-university-of-tennessee-orange-950: #340c00;
}

SCSS

$university-of-tennessee-orange: #f77f00;
$university-of-tennessee-orange-rgb: 247, 127, 0;
$university-of-tennessee-orange-light: mix(#fff, $university-of-tennessee-orange, 20%);
$university-of-tennessee-orange-dark: mix(#000, $university-of-tennessee-orange, 20%);

.element {
  color: $university-of-tennessee-orange;
  box-shadow: 0 0 0 2px rgba($university-of-tennessee-orange, 0.35);
}