Wheat

Meet Wheat (#F5DEB3), a soft, pale tint of yellow with a distinctively warm and earthy quality. Its gentle luminosity and subtle complexity make it a versatile foundation for palettes that require a touch of organic sophistication without overpowering the core design elements.

What color is Wheat?

What is the meaning of Wheat?

How do I use Wheat (#F5DEB3) in UI design?

Using Wheat color codes

Wheat

#F5DEB3

Access our full UI & UX library today.

What color is Wheat?

What is the meaning of Wheat?

How do I use Wheat (#F5DEB3) in UI design?

Using Wheat color codes

Wheat Code Conversions

HEX

#F5DEB3

LAB

89, 2, 24

RGB

245, 222, 179

XYZ

71.9, 74.9, 53.3

HSL

39°, 77%, 83%

LCH

89, 24, 86°

HSB

39°, 27%, 96%

LUV

89, 17, 34

CMYK

0, 9, 27, 4

CMYK

0, 9, 27, 4

HWB

39°, 70%, 4%

Wheat Color Harmonies

Analogous

Analogous colors sit side-by-side on the color wheel. Using them with Wheat results in a cohesive and soothing palette for any interface.

#F5BDB3

#F5DEB3

#EBF5B3

#F5BDB3

#F5DEB3

#EBF5B3

Complementary

Complementary colors are opposites on the color wheel. When paired with Wheat, its complement creates a high-contrast combination that is visually striking.

#F5DEB3

#B3CAF5

#F5DEB3

#B3CAF5

Split Complementary

A split complementary scheme for Wheat uses the two colors adjacent to its direct complement, offering a vibrant yet balanced palette.

#F5DEB3

#B3EBF5

#BDB3F5

#F5DEB3

#B3EBF5

#BDB3F5

Triadic

Triadic palettes pair Wheat with two additional hues from equidistant points on the color wheel, resulting in a balanced yet striking color combination.

#F5DEB3

#B3F5DE

#DEB3F5

#F5DEB3

#B3F5DE

#DEB3F5

Tetradic

Tetradic schemes use two complementary color pairs. For Wheat, this creates a rich, four-color palette by forming a rectangle on the color wheel.

#F5DEB3

#B3F5BD

#B3CAF5

#F5B3EB

#F5DEB3

#B3F5BD

#B3CAF5

#F5B3EB

Square

A square scheme combines two pairs of complementary colors. With Wheat as a base, this creates a rich, high-contrast palette with four evenly spaced hues.

#F5DEB3

#B3F5BD

#B3CAF5

#F5B3EB

#F5DEB3

#B3F5BD

#B3CAF5

#F5B3EB

Wheat Contrast Simulation

Text Color

#

Background Color

#

15.98

Super

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Your Catchy Large Text Goes Here

A high contrast makes anything easier to read, especially small text.

Text Color

#

Background Color

#

Your Catchy Large Text Goes Here

A high contrast makes anything easier to read, especially small text.

15.98

Super

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Wheat Color Variations

Shades

Shades are darker versions of Wheat, made by adding black to create depth and weight.

#F5DEB3

#D2BE99

#AF9F80

#8C7F66

#695F4D

#463F33

#23201A

#000000

#F5DEB3

#D2BE99

#AF9F80

#8C7F66

#695F4D

#463F33

#23201A

#000000

Tints

Tints are lighter versions of Wheat, created by adding white for a softer, more delicate feel.

#F5DEB3

#F6E3BE

#F8E7C9

#F9ECD4

#FBF1DE

#FCF6E9

#FEFAF4

#FFFFFF

#F5DEB3

#F6E3BE

#F8E7C9

#F9ECD4

#FBF1DE

#FCF6E9

#FEFAF4

#FFFFFF

Tones

Tones are created by adding gray to Wheat, resulting in softer, less saturated versions.

#F5DEB3

#E4D1AC

#D4C3A4

#C3B69D

#B2A896

#A19B8F

#918D87

#808080

#F5DEB3

#E4D1AC

#D4C3A4

#C3B69D

#B2A896

#A19B8F

#918D87

#808080

Hues

Hues are variations of Wheat, sharing its base color but differing in intensity or temperature.

#F5DEB3

#DAF5B3

#B3F5BD

#B3F5EF

#B3CAF5

#CEB3F5

#F5B3EB

#F5B3B9

#F5DEB3

#DAF5B3

#B3F5BD

#B3F5EF

#B3CAF5

#CEB3F5

#F5B3EB

#F5B3B9

What Interfaces Use Colors Like Wheat?

Never run out of
inspiration again.

Use Mobbin for free as long as you like or get full access
with any of our paid plans.

  • Coinbase

  • Wise

  • Headspace

  • Airbnb

  • Uber

  • Nike

  • Pinterest

  • ChatGPT

  • Shopify

  • Loom

  • Creme

  • Mailchimp

  • Twitch

  • Spotify

  • Apple TV

  • Shop

  • Cosmos

  • Retro

  • Notion

  • Dropbox

Never run out of
inspiration again.

Use Mobbin for free as long as you like or get full access
with any of our paid plans.

  • Coinbase

  • Wise

  • Headspace

  • Airbnb

  • Uber

  • Nike

  • Pinterest

  • ChatGPT

  • Shopify

  • Loom

  • Creme

  • Mailchimp

  • Twitch

  • Spotify

  • Apple TV

  • Shop

  • Cosmos

  • Retro

  • Notion

  • Dropbox

Never run out of
inspiration again.

Use Mobbin for free as long as you like or get full access with any of our paid plans.

  • Coinbase

  • Wise

  • Headspace

  • Airbnb

  • Uber

  • Nike

  • Pinterest

  • ChatGPT

  • Shopify

  • Loom

  • Creme

  • Mailchimp

  • Twitch

  • Spotify

  • Apple TV

  • Shop

  • Cosmos

  • Retro

  • Notion

  • Dropbox