Frappé au Chocolat
#9a6840
Mocha-brunette mid-tone with cocoa warmth over amber
About Frappé au Chocolat
I keep thinking of a chocolate milkshake with a thin layer of cocoa foam. Frappé au Chocolat reads as a medium warm brown, but it's not dusty like Argan Oil. It has more cocoa depth and a smoother, slightly creamier body, so it feels more drink-mixed than sun-faded.
Compared to Eagle, it won't glare as golden or coin-bright. Compared to Hazel, it stays cooler and more chocolate-leaning, less soil-spiced. I reach for it when the UI needs a brown that feels softly grounded without sliding into orange-brown. It's great for e-commerce and food packaging systems where you want product cards, pricing chips, and label panels that look rich at a glance, plus hospitality menus and recipe editors that need a cocoa-sense background behind type.
Pair it with warm creams or neutral grays. If you drop it next to very cool tones, it can go flat fast, like the chocolate lost its milk.
Code snippets
Copy this color into your project.
Contrast checker
WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.
On White #ffffff
On Gray 100 #f5f5f5
On Gray 900 #18181b
On Black #000000
Variations
Shades
Darker variations, created by mixing toward black.
Tints
Lighter variations, created by mixing toward white.
Tones
Muted variations, created by reducing saturation.
Hues
Hue rotations around the color wheel.
Temperatures
Warm and cool shifts of this color.
Color harmonies
Suggested palettes
Palettes built around this color.
Community palettes
Published palettes that include this color.
Similar colors
Create a gradient with Frappé au Chocolat
Open the generator with this color pre-loaded.
Start creating