Tempered Cocoa color palette — #FAF4EE · #E9DDBD · #A2C096 · #AF909F · #604A00

Bronze takes the lead with Sage close behind in a set that reads as nature and growth at first glance.

The five colors

• Ivory (#FAF4EE): bright and airy, almost weightless.
• Celadon Mist (#E9DDBD): A whisper-light, dusty gold — the color of old brass.
• Sage (#A2C096): A luminous, dusty green — the color of fresh herbs.
• Dusty Rose (#AF909F): A luminous, dusty rose — the color of pressed rose petals.
• Bronze (#604A00): A full-bodied, balanced gold — the color of honey in a jar.

Feels like: Nature, Growth, Optimism, Sophistication, Softness, Clarity. Tagged botanical, earthy, muted, light.

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

• Cocoa Drift color palette (#FAF4EB, #B7EED9, #B4B08B, #977E89, #564400)
• Coral Thicket color palette (#FFF2EC, #FFC4BC, #76DBD1, #E78C80, #40533C)
• Antique Clover Harbor color palette (#FFF3E3, #C8D97C, #4ABF72, #917DB4, #383F16)
• Patina Powder Quarry color palette (#FBF3F1, #C3E0E4, #95D1E8, #86AE8A, #5C4D5D)
• Aged Terrace color palette (#FFF2EE, #D8FCD7, #E0DCCE, #DFB2BC, #7C401F)
• Muted Apricot Drift color palette (#FFF2ED, #F1D6BD, #F9A18B, #BA776F, #403935)
• Ancient Powder Corridor color palette (#FFF2EF, #F7B0C3, #71CAF4, #8EA7D3, #523C38)
• Antique Courtyard color palette (#ECF4EC, #A7CEBA, #5A8F83, #5A6078, #21362C)

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