Tempered Cocoa color palette — #FFF2ED · #DFDACE · #A6B3CA · #BF908C · #7C401F

Bronze and Dusty Rose set the tone — five colors that lean into optimism and sophistication.

The five colors

• Ivory (#FFF2ED): bright and airy, almost weightless.
• Bone (#DFDACE): bright and airy, almost weightless.
• Ash (#A6B3CA): A luminous, dusty violet — the color of wild irises.
• Dusty Rose (#BF908C): A luminous, dusty orange — the color of toasted spice.
• Bronze (#7C401F): A full-bodied, balanced orange — the color of autumn markets.

Feels like: Optimism, Sophistication, Softness, Clarity. Tagged pastel, light, 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 Alley color palette (#FFF3E6, #DCE0C9, #B8CFAE, #C19D86, #684500)
• Patina Powder Canyon color palette (#FBF2FC, #C2F3E1, #E8D7D7, #B7AED8, #5E4D5A)
• Timeworn Basin color palette (#FFF4E3, #D7C9AB, #AE9876, #996931, #554700)
• Airy Lagoon color palette (#FFEBE0, #C99A73, #A17A00, #782B3F, #210800)
• Dusty Dune color palette (#FFF3E7, #D29F6E, #65A7B9, #6978A8, #583300)
• Patina Dune color palette (#FFF2EA, #E7DEB6, #E6D166, #C57272, #5F3D24)
• Dusty Bronze color palette (#FCF3EC, #E6CDA6, #A5703D, #713F02, #332920)
• Powdered Lime color palette (#FAEED5, #9DC067, #5AA675, #7F5500, #141600)

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