Kihada Yellow

CSS

:root {
  --kihada-yellow: #fef263;
  --kihada-yellow-rgb: 254 242 99;
  --kihada-yellow-oklch: oklch(0.945 0.161 104.5);
}

.element {
  color: var(--kihada-yellow);
  background-color: hsl(55 99% 69%);
  border-color: oklch(0.945 0.161 104.5);
}

Tailwind CSS v4

@theme {
  --color-kihada-yellow: #fef263;
  --color-kihada-yellow-50: #faf9c4;
  --color-kihada-yellow-100: #eeecad;
  --color-kihada-yellow-200: #dcd986;
  --color-kihada-yellow-300: #c2bd51;
  --color-kihada-yellow-400: #aea200;
  --color-kihada-yellow-500: #998900;
  --color-kihada-yellow-600: #817400;
  --color-kihada-yellow-700: #675d00;
  --color-kihada-yellow-800: #4e4300;
  --color-kihada-yellow-900: #362e00;
  --color-kihada-yellow-950: #211b00;
}

SCSS

$kihada-yellow: #fef263;
$kihada-yellow-rgb: 254, 242, 99;
$kihada-yellow-light: mix(#fff, $kihada-yellow, 20%);
$kihada-yellow-dark: mix(#000, $kihada-yellow, 20%);

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