Wheat #f5deb3

The color of a full harvest.

RGB

245, 222, 179

HSL

39°, 77%, 83%

CMYK

0, 9, 27, 4

Luminance

0.7491

About Wheat

Wheat, #f5deb3, is pale gold-beige — the field at ripeness, the loaf’s crumb, the neutral that means abundance. Warmer than cream, lighter than tan, it is the softest agricultural warm.

History

Wheat colored the granaries of every early civilization and the flags of a few (its sheaves still crest coats of arms). The color name entered decorative use as farmhouse and prairie aesthetics romanticized the field.

Psychology

Wheat reads nourishing, calm and golden-hour — the psychology of plenty at low saturation. It warms interiors and packaging with a whisper of gold.

In design

Wheat is a canvas and surface tint: bakery and organic packaging, farmhouse walls, parchment-feel UIs. Text-free. Pair with espresso and forest (harvest), terracotta and sage (prairie modern), navy for contrast.

In culture

Amber waves of grain, wheat-sheaf heraldry, separating wheat from chaff: the crop that fed civilization seeded its color into anthem and idiom alike.

Brands that own wheat

Whole grain packaging#e8d0a0 Farmhouse interiors#f5deb3 Bakery brands#ecd9b0 Organic labels#e6d3a3 Prairie aesthetic#ead9ac

Shades of wheat

Cream Beige Tan Champagne Vanilla Sand Straw Bisque

Every format

HEX	#f5deb3
RGB	rgb(245, 222, 179)
HSL	hsl(39, 77%, 83%)
CMYK	cmyk(0%, 9%, 27%, 4%)
LAB	lab(89.3 1.5 24.0)
LCH	lch(89.3 24.1 86.4)
OKLCH	oklch(0.909 0.061 83.0)

Copy-ready code

/* CSS */
color: #f5deb3;
background-color: #f5deb3;
/* Tailwind (arbitrary) */
class="text-[#f5deb3] bg-[#f5deb3]"
/* SCSS */
$brand: #f5deb3;
/* SwiftUI */
Color(red: 0.961, green: 0.871, blue: 0.702)
/* Android */
Color.parseColor("#f5deb3")

Accessibility — WCAG contrast

#f5deb3 on white: 1.31:1

AA ✗ fail · AA-large ✗ · AAA ✗

#f5deb3 on black: 15.98:1

AA ✓ pass · AA-large ✓ · AAA ✓

true color

protanopia

deuteranopia

tritanopia

RGB percentages

Red96.1%

Green87.1%

Blue70.2%

CMYK percentages

Cyan0.0%

Magenta9.4%

Yellow26.9%

Key (black)3.9%

Color previews

#f5deb3 text on a black background

contrast 15.98:1

Card sample

#f5deb3 text on a white background

contrast 1.31:1

Card sample

CSS3 live lab

Text font color

The quick brown fox

color: #f5deb3;

Background color

Panel with #f5deb3 background

background-color: #f5deb3;

Text shadow — hex

Glowing headline

text-shadow: 2px 2px 8px #f5deb3;

Text shadow — RGB

Soft neon halo

text-shadow: 0 0 14px rgba(245, 222, 179, 0.45);

Div box shadow

Elevated card

box-shadow: 0 12px 32px -8px rgba(245, 222, 179, 0.45);

Border & gradient

Gradient panel

border: 3px solid #f5deb3;
background: linear-gradient(135deg, #f5deb3, #E0F5B3);

Monochromatic scale

#362607 #75520F #B47E18 #E4A530 #ECC06F #F4DCAE #FAEFDB

Palettes built from #f5deb3

UI palette

Gradient stops

Accent trio

Warm–cool bridge

Shades — darker

#F0CE8D #EBBD68 #E6AD43 #E19D1E #BB8319 #966814 #704E0F #4B340A #251A05

Tints — lighter

#F6E1BA #F7E5C2 #F8E8CA #F9EBD1 #FAEED9 #FBF2E1 #FCF5E8 #FDF8F0 #FDF9F1

Hue & tone neighbors

#F5C8B3 #F5D3B3 #F5E9B3 #F5F4B3 #FBF1E0 #EFCA86 #FEE1AA #ECDBBB

Color harmonies

Complement

Split-complement

Analogous

Triadic

Tetradic

Nearest named colors

tan · ΔE 14.8 beige · ΔE 14.8 ivory · ΔE 20.2 khaki · ΔE 23.5 white · ΔE 26.3

Wheat, answered

What is the hex code for wheat?

CSS wheat is #f5deb3; straw runs yellower at #e4d96f, bisque pinker at #ffe4c4.

Wheat vs cream vs beige?

Cream is the dairy warm-white, beige the neutral tan-white, wheat the golden agricultural one — most yellow of the three.

What pairs with wheat?

Espresso and forest (harvest), terracotta and sage (prairie modern), navy and denim for grounding contrast.

Work with #f5deb3 in the Color Lab

Contrast Checker →Palette Generator →Palette Pro →Scale Generator →CSS Code Generator →Color Blind Simulator →Accessibility Checker →Color Distance →