BrownSugar
#AF6E4DBrown family
About BrownSugar
BrownSugar (#AF6E4D) is a medium, muted brown. Brown is a warm, earthy neutral created by darkening orange or red, so this shade feels grounded, natural and enduring rather than flashy.
Psychology
Brown evokes stability, reliability and comfort. It is the color of wood, earth and leather, so it reads as honest, rustic and warm, though in some contexts it can feel conservative or plain.
Applications
Brown is a staple of organic, coffee, chocolate, outdoor and craft brands. It works as a grounding neutral in palettes, for premium packaging, and in interior or furniture design where warmth and durability matter.
History
Browns have been made from earth pigments like umber, sienna and ochre since prehistoric times, and those same pigments still appear in artists’ palettes today under their traditional names.
Meaning
Brown represents earth, home, simplicity and reliability. It can signal wholesomeness and craftsmanship, and it often appears in brands that want to feel authentic, natural and down-to-earth.
Why use this color
Choose brown for brands and designs that need warmth, authenticity and a natural, grounded feel. It is perfect for coffee, food, outdoor and handmade products and for grounding brighter palettes.
Accessibility
Against white, #AF6E4D has a 4.1:1 contrast ratio; against black it is 5.2:1. Black text on #AF6E4D meets WCAG AA for normal text.
Fun facts
- Artists' browns like umber and sienna are named after the regions in Italy where the earth pigments were mined.
- Brown is essentially a dark, desaturated orange or red.
- Coffee, chocolate and wood all owe their rich, familiar tones to brown compounds.
Shades, tints & tones
Variations
Ten lightness steps plus BrownSugar's tints, shades and tones — every swatch copies its hex on click.
Lightness scale
Tints (toward white)
Shades (toward black)
Tones (toward gray)
Color theory
Color harmonies
Proven schemes built around BrownSugar. Each swatch is one click from your clipboard.
Complementary
Analogous
Triadic
Split-complementary
Tetradic
Monochromatic
Accessibility
Blindness simulator
See how BrownSugar is perceived with common types of color vision deficiency.
Normal vision
Standard trichromatic vision, shown for reference.
Protanopia
Red-blind. Reds look darker and can be confused with greens and browns.
Deuteranopia
Green-blind. Greens look muted and can be confused with reds and browns.
Tritanopia
Blue-blind. Blues look greenish and yellows fade toward pink.
Achromatopsia
Complete color blindness. Everything is seen in shades of gray.
WCAG
Contrast checker
How BrownSugar performs against black and white text, with WCAG AA and AAA ratings.
The ratio is identical whether BrownSugar is used as the text or the background.
Open the full checkerReady to use
Color palettes
Curated palettes that put BrownSugar to work, with copy-all support for each.
Complementary
Roughly 180° across the wheel from #AF6E4D (hue 20°) sits #4c8dae, held together by the #d0b6a9 tint and the neutrals #f4f4f5 and #18181b.
Analogous
#AF6E4D with its two closest neighbours, #ae4c5c and #ae9d4c, for a 39%-saturation run that stays inside one family; #d0b6a9 and #553525 add depth without breaking it.
Triadic
#AF6E4D plus #4cae6d and #6d4cae, a triangle that sits 120° apart at every corner, with #f4f4f5 and #18181b doing the quiet work underneath.
Monochromatic
One hue at 5 lightness steps: #f9f3f1 through #150d09, starting from #AF6E4D at 49% lightness.
BrownSugar (#AF6E4D) is a brown-family color. Use its values, variations, harmonies and palettes above to put it to work in your next design.
Frequently asked questions
BrownSugar is #AF6E4D — rgb(175, 110, 77) / hsl(20, 39%, 49%). BrownSugar (#AF6E4D) is a medium, muted brown. Brown is a warm, earthy neutral created by darkening orange or red, so this shade feels grounded, natural and enduring rather than flashy.
Good to know
- BrownSugar is one of 609 named colors in the library.
- Its complementary hue sits 180° away on the color wheel: #4c8dae.
More color tools
Next steps for BrownSugar: each of these picks the value up where this page leaves off, so nothing gets retyped or re-uploaded.