Weathered Cocoa color palette — #F9F0EA · #CEB7A0 · #A37765 · #77494B · #352A17

Built around Coffee, softened by Mocha — the whole palette hums with optimism and warmth.

The five colors

• Cream (#F9F0EA): bright and airy, almost weightless.
• Stone (#CEB7A0): A luminous, dusty gold — the color of old brass.
• Mocha (#A37765): A luminous, dusty orange — the color of autumn markets.
• Coffee (#77494B): A full-bodied, dusty red — the color of embers at dusk.
• Espresso (#352A17): A deep, shadowed, dusty gold — the color of old brass.

Feels like: Optimism, Warmth, Comfort, Sophistication, Grounding. Tagged earthy, warm, muted.

Use it as a design system

One click turns Weathered Cocoa into a complete token system: semantic roles from primary to success, an 11-stop OKLCH scale per role, a WCAG AA/AAA and APCA contrast matrix, an auto-derived dark mode and 11 export formats including CSS custom properties, Tailwind, Figma Variables and shadcn/ui.

Similar palettes

• Hushed Chestnut Field color palette (#FEF3EB, #CDB29D, #A5735C, #884C28, #683C00)
• Driftwood Study color palette (#FFF0F9, #EED2D2, #C6A2B7, #A16A5C, #4C3940)
• Chestnut Grove color palette (#F6F1E9, #D8BF9A, #705F32, #34302A, #191307)
• Wandering Chestnut color palette (#F0E3D3, #908758, #724D00, #502200, #0C1000)
• Washed Pewter color palette (#F7F1E6, #A89356, #4D8CA8, #734D80, #2A2110)
• Taupe Lagoon color palette (#FFF0F9, #E1C0CB, #C68C73, #866986, #3E4C41)
• Weathered Garnet color palette (#FEE4C9, #B89D5A, #985B00, #762400, #1E1E00)
• Hushed Bronze color palette (#F5F1EB, #D4C19C, #369296, #896E00, #0D190F)

Browse the whole catalog at Explore, or see today's palette.