Sunburst

CSS

:root {
  --sunburst: #f5b57b;
  --sunburst-rgb: 245 181 123;
  --sunburst-oklch: oklch(0.82 0.105 62.7);
}

.element {
  color: var(--sunburst);
  background-color: hsl(29 86% 72%);
  border-color: oklch(0.82 0.105 62.7);
}

Tailwind CSS v4

@theme {
  --color-sunburst: #f5b57b;
  --color-sunburst-50: #fff0d6;
  --color-sunburst-100: #ffe1c4;
  --color-sunburst-200: #f5cca6;
  --color-sunburst-300: #ddad7e;
  --color-sunburst-400: #cb905a;
  --color-sunburst-500: #b77533;
  --color-sunburst-600: #9a632c;
  --color-sunburst-700: #7c4f23;
  --color-sunburst-800: #5c3918;
  --color-sunburst-900: #412710;
  --color-sunburst-950: #291503;
}

SCSS

$sunburst: #f5b57b;
$sunburst-rgb: 245, 181, 123;
$sunburst-light: mix(#fff, $sunburst, 20%);
$sunburst-dark: mix(#000, $sunburst, 20%);

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