Tempered Cocoa color palette — #FCF3EF · #D0BD9F · #814F43 · #5D2600 · #2B241A

Espresso takes the lead with Coffee close behind in a set that reads as optimism and sophistication at first glance.

The five colors

• Ivory (#FCF3EF): bright and airy, almost weightless.
• Sand (#D0BD9F): A luminous, dusty gold — the color of honey in a jar.
• Coffee (#814F43): A full-bodied, dusty orange — the color of toasted spice.
• Espresso (#5D2600): A deep, shadowed, balanced orange — the color of toasted spice.
• Onyx (#2B241A): A deep, shadowed, dusty gold — the color of honey in a jar.

Feels like: Optimism, Sophistication. Tagged luxury, dark, 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

• Washed Bronze color palette (#FAF4F0, #DAB8A1, #838139, #A45324, #302E27)
• Aged Fern Lagoon color palette (#FAF5E7, #C3AB7C, #5C5210, #352E00, #1C1F13)
• Sand Boulevard color palette (#FDF1F9, #F8DA9D, #C68F81, #7D6476, #32282F)
• Wandering Driftwood Terrace color palette (#F9F3F8, #ABDECC, #A56C6A, #5C445A, #312830)
• Nocturne Chestnut color palette (#ECDBD0, #785900, #1B2926, #270A00, #070100)
• Weathered Bronze Quarry color palette (#E8DECF, #967525, #322500, #0F191F, #0E0800)
• Washed Thicket color palette (#FCF4E7, #BFA37B, #747D41, #2B5D86, #4B4741)
• Antique Harbor color palette (#FCF3EB, #A2765B, #0B736F, #424E86, #462E2D)

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