Cocoa Harbor color palette — #F8F5EF · #E5CDA9 · #8E7B4B · #654700 · #322A1D

Bronze and Walnut set the tone — five colors that lean into optimism and sophistication.

The five colors

• Ivory (#F8F5EF): a clean, paper-quiet neutral.
• Wheat (#E5CDA9): A whisper-light, dusty gold — the color of old brass.
• Walnut (#8E7B4B): A full-bodied, dusty gold — the color of old brass.
• Bronze (#654700): A full-bodied, balanced gold — the color of afternoon light on wheat.
• Espresso (#322A1D): A deep, shadowed, dusty gold — the color of old brass.

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

• Washed Atelier color palette (#ECF9F0, #C9DBC9, #968454, #354D3C, #151E18)
• Softworn Bronze Studio color palette (#FAF4EB, #F7DB9D, #B09C6D, #896621, #302B21)
• Ancient Ridge color palette (#F8F5EF, #E2CFA9, #5BACA3, #A6891A, #273124)
• Softworn Olive Veranda color palette (#F9F5E6, #DFB271, #696F00, #3A3E00, #201A01)
• Dusty Bronze color palette (#F5ECD6, #986B00, #322C00, #1A221C, #070600)
• Hushed Fern Studio color palette (#E0DFCF, #CA9B5F, #465F00, #202E00, #0E0C00)
• Pewter Meadow color palette (#FFF2EA, #BCC392, #5FA18D, #955879, #4B4B00)
• Washed Harbor color palette (#ECF0DE, #C18344, #005422, #002209, #000401)

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