Tempered Cocoa color palette — #FFF3E9 · #E3C192 · #AF7D5C · #80453E · #2C1F00

Coffee and Caramel set the tone — five colors that lean into optimism and sophistication.

The five colors

• Ivory (#FFF3E9): bright and airy, almost weightless.
• Sand (#E3C192): A whisper-light, dusty gold — the color of afternoon light on wheat.
• Caramel (#AF7D5C): A luminous, dusty gold — the color of old brass.
• Coffee (#80453E): A full-bodied, balanced orange — the color of autumn markets.
• Onyx (#2C1F00): A deep, shadowed, dusty gold — the color of old brass.

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

Use it as a design system

One click turns Tempered 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

• Muted Driftwood Thicket color palette (#FDF5DF, #BDD09B, #958C43, #735118, #202409)
• Ancient Bronze color palette (#FFF3E5, #C2B27A, #9D6A19, #723005, #171200)
• Wandering Bronze color palette (#FFF3E4, #EBDBB9, #B59971, #935C2E, #33322B)
• Moss Balcony color palette (#EDDEC5, #8C8B2A, #614900, #351A00, #010200)
• Chestnut Veranda color palette (#FFDFBF, #B39650, #885107, #591900, #040400)
• Bronze Courtyard color palette (#F4E2EA, #E0B3C3, #C4916C, #A66849, #1F371F)
• Antique Chapel color palette (#E1FCF5, #4FA3F3, #BB783B, #8C4D00, #001A15)
• Deep Bronze color palette (#F2DDCE, #9A6615, #612A00, #2B0002, #020100)

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