Cocoa Harbor color palette — #FFF0F8 · #CEA778 · #754228 · #402334 · #261717

A conversation between Bronze and Camel, giving this palette its sense of optimism and sophistication.

The five colors

• Ivory (#FFF0F8): a clean, paper-quiet neutral.
• Camel (#CEA778): A luminous, dusty gold — the color of honey in a jar.
• Bronze (#754228): A full-bodied, balanced orange — the color of autumn markets.
• Espresso (#402334): A deep, shadowed, dusty pink — the color of peonies in June.
• Onyx (#261717): A deep, shadowed, dusty red — the color of a theater curtain.

Feels like: Optimism, Sophistication. Tagged luxury, dark, muted.

Use it as a design system

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

• Wandering Bronze Atelier color palette (#FFF2EB, #CDC696, #9E5E4C, #673021, #2E1D13)
• Antique Stone Summit color palette (#EDF9ED, #C7AA75, #6A4A19, #1B351C, #0B201B)
• Softworn Chestnut Summit color palette (#FEF1F5, #D8A269, #71742E, #875100, #142921)
• Tempered Cocoa Market color palette (#F9EEF5, #92BFA7, #80402E, #471405, #150711)
• Amber Balcony color palette (#FCF3ED, #F5CDA1, #CF7C55, #825743, #2C1E14)
• Amber Field color palette (#F6DDE5, #C08600, #563100, #291500, #0B0800)
• Tempered Bronze Thicket color palette (#FFF1F5, #A87539, #497F52, #006156, #422B33)
• Chestnut Lantern color palette (#D7EEDB, #785900, #252732, #1C1200, #040200)

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