Wheat

wheat is a CSS color keyword. The closest Tailwind step is orange-200 (#fed7aa).

#f5deb3rgb(245, 222, 179)
Hex
#f5deb3
RGB
245, 222, 179
HSL
39°, 77%, 83%
OKLCH
90.9% 0.061 83.0
LAB
89.4 1.5 24.0

Open #f5deb3 in the explorer

Text contrast

Black or white text on #f5deb3. AA needs 4.5:1 and AAA needs 7:1. APCA Lc is a separate readability score.

Black text16.0:1 AAAAPCA Lc 89
White text1.3:1 FailAPCA Lc -17

Color vision

How #f5deb3 looks in simulations of color blindness, at full severity.

Full color
#f5deb3
Protanopia
#e9ddb0
Deuteranopia
#efe3b4
Tritanopia
#ffd6d2

Tonal scale

An OKLCH ramp that keeps this hue. The marked step is the closest lightness to wheat.

50100200300400500600700800900950

Copy into CSS

color: wheat;
background: #f5deb3;
@theme {
  --color-wheat-50: #fff4df;
  --color-wheat-100: #fce5ba;
  --color-wheat-200: #e5cea4;
  --color-wheat-300: #c7b188;
  --color-wheat-400: #ab956d;
  --color-wheat-500: #8c7750;
  --color-wheat-600: #715d36;
  --color-wheat-700: #5b4720;
  --color-wheat-800: #453208;
  --color-wheat-900: #2e1f00;
  --color-wheat-950: #140c00;
}