Tempered Cocoa color palette — #FFF3E9 · #C7FFF0 · #DFDAC6 · #D2A08F · #6A3B00

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

The five colors

• Ivory (#FFF3E9): bright and airy, almost weightless.
• Honeydew (#C7FFF0): A whisper-light, dusty teal — the color of glacier melt.
• Bone (#DFDAC6): A whisper-light, dusty green — the color of a quiet forest floor.
• Camel (#D2A08F): A luminous, dusty orange — the color of toasted spice.
• Bronze (#6A3B00): A full-bodied, balanced gold — the color of old brass.

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

• Aged Taupe color palette (#FFF2EF, #E1D8CF, #98B9A4, #D198B2, #654942)
• Basalt Atelier color palette (#FBF5E2, #CED6A7, #B0B07A, #968662, #453E00)
• Soft Tangerine Orchard color palette (#FFF3E5, #FFDE9B, #DBD06E, #EE8304, #523700)
• Chestnut Dune color palette (#FCF4E9, #EED19A, #AD905D, #815B17, #2A200F)
• Aged Mustard color palette (#FFECF4, #D1DCC8, #DBBD73, #9A6B57, #432D36)
• Marigold Orchard color palette (#FEF3E9, #ECA255, #A386CC, #A75E86, #3E2519)
• Washed Mustard color palette (#FBF5E4, #C9BC5D, #5BC1B3, #4E9CAF, #35332C)
• Moss Orchard color palette (#F4E8CE, #B4B55B, #80A34B, #8E6900, #0C0C00)

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