Cocoa Quarry color palette — #FFF3E4 · #E7AF97 · #B4885C · #587A4C · #6C3900

Bronze and Caramel set the tone — five colors that lean into nature and growth.

The five colors

• Cream (#FFF3E4): A whisper-light, dusty gold — the color of old brass.
• Sand (#E7AF97): A luminous, dusty orange — the color of toasted spice.
• Caramel (#B4885C): A luminous, balanced gold — the color of honey in a jar.
• Olive (#587A4C): A full-bodied, dusty green — the color of new leaves after rain.
• Bronze (#6C3900): A full-bodied, balanced gold — the color of old brass.

Feels like: Nature, Growth, Optimism, Warmth, Comfort, Balance. Tagged retro, muted, warm.

Use it as a design system

One click turns Cocoa Quarry 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

• Dusty Cocoa color palette (#FBF5E8, #CFBC8B, #93975E, #297E73, #5B4400)
• Washed Bronze color palette (#FEF3E9, #E0AEBB, #BB817E, #7E6E34, #59413B)
• Taupe Lantern color palette (#ECF9EC, #FFD1C1, #C5976F, #4A7E74, #4D3843)
• Soft Taupe color palette (#FBEDD0, #BF9C4E, #7E7B27, #006456, #3B2F01)
• Patina Bronze color palette (#FCF4E5, #D4939E, #9B6C3C, #315E81, #4E4642)
• Wandering Chestnut Summit color palette (#F9F0E9, #C68C6F, #7C4B11, #572A00, #281F1B)
• Wandering Balcony color palette (#F4F6EF, #CCD5BC, #91A37F, #A17338, #43550F)
• Wandering Quarry color palette (#FBF4EA, #CCAC7A, #80955E, #187A64, #124A5A)

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