18 Different Shades of Hazel (+ HEX codes)

Explore all shades of hazel, from lighter to darker shades. See HEX codes, shade names, and hazel color palettes. Click any shade to copy its HEX code.

Hazel is a muted gold-brown, the colour of eyes and of dry grass. It is quieter than mustard and warmer than olive, which makes it a useful bridge between the two.

It works in autumn palettes, natural cosmetics and typography set on cream.

linen
#fcf9ee
coconut cream
#f8f2d8
sidecar
#f5eac1
double colonial white
#f1e3ab
chalky
#eddc95
flax
#e9d47f
rob roy
#e6cd69
anzac
#e2c553
golden grass
#dab727
nugget
#c6a522
lucky
#b0931e
hacienda
#9a811a
olivetone
#846e16
raw umber
#6e5c13
bronze olive
#58490f
cannon black
#2c2507
acadia
#161204
black
#000000

Hazel: HEX & RGB Codes

hazel has the following primary color codes:

HEX: #fcf9ee
RGB: (252, 249, 238).

Explore a wide range of hazel shades using our interactive color picker. Click any color to copy its HEX code and use it in your project!

Explore tints of hazel

Linen
#fcf9ee
Linen
#fcf9ee
Linen
#fdfaf2
Linen
#fdfbf2
Bianca
#fdfcf6
Bianca
#fdfcf7
Old Lace
#fefcf6
Bianca
#fefdfb
Bianca
#fefefb
White
#ffffff

Explore shades of hazel

Brown Tumbleweed
#332b0a
Punga
#4c4015
Dallas
#645626
Yellow Metal
#7d6f3b
Barley Corn
#958756
Mongoose
#afa374
Rodeo Dust
#c9be97
Stark White
#e3dcc0

hazel in HEX, RGB, HSL and CMYK

HEX	#8E7618
RGB	rgb(142, 118, 24)
HSL	hsl(48, 71%, 33%)
CMYK	cmyk(0%, 17%, 83%, 44%)

Tints and shades of hazel

Tints add white and shades add black, keeping the hue. Use them for hover states, borders and backgrounds that still belong to the same colour.

Tints (lighter)

#be9e20
#ddbc36
#e5cb64
#edda92
#f4eac0
#fcf9ee

Shades (darker)

#7b6615
#665511
#51430e
#3c320a
#272007
#110f03

Colours that work with hazel

Complementary

#8E7618 #183090

Opposite on the colour wheel. Maximum contrast — use it for accents, not for half the page.

Analogous

#903c18 #8E7618 #6c9018

Neighbours on the wheel. Calm and cohesive, the safest way to build a palette.

Triadic

#8E7618 #189078 #781890

Three colours evenly spaced. Lively and balanced; let one dominate.

Text on hazel

Example Primary text

White text on hazel4.42:1Large text only

Example Primary text

Near-black text on hazel4.02:1Large text only

Measured against WCAG: 4.5:1 for body text, 3:1 for large text. Test your own pair in the Contrast Checker

hazel shade chart

Shade chart showing five steps of hazel, from light tint to deep shade

Right-click to save the chart, or copy the individual codes above.