Tempered Cocoa color palette — #FCF1FC · #96B1DB · #B19460 · #5573A2 · #684500

Bronze takes the lead with Slate close behind in a set that reads as trust and stability at first glance.

The five colors

• Ivory (#FCF1FC): bright and airy, almost weightless.
• Mauve (#96B1DB): A luminous, dusty blue — the color of open sky before noon.
• Caramel (#B19460): A luminous, dusty gold — the color of afternoon light on wheat.
• Slate (#5573A2): A full-bodied, balanced blue — the color of deep harbor water.
• Bronze (#684500): A full-bodied, balanced gold — the color of afternoon light on wheat.

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

• Patina Pewter color palette (#FFF1F5, #BBA5D3, #8CA170, #81639E, #554F00)
• Ancient Cobalt Station color palette (#F9EEF7, #9DB4DC, #B89664, #4C70B2, #35302A)
• Petrol Boulevard color palette (#EBF9EF, #72BDCC, #C88575, #1F808F, #534B47)
• Hushed Iris color palette (#F0F5FF, #B0C3F3, #D2A879, #6887DE, #673F4D)
• Timeworn Pine color palette (#FFF0FC, #7F97CD, #B07973, #548457, #4D3C4B)
• Bronze Pier color palette (#FFF3EB, #CAB39E, #AB7145, #894A2C, #624000)
• Hushed Veranda color palette (#FCF1FB, #E7D6D7, #DCB9AE, #6B9A8B, #614D5B)
• Wandering Lapis Thicket color palette (#FFF0F9, #8485EF, #907F00, #5038D2, #433B00)

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