Cocoa Harbor color palette — #F7EEDF · #5E4900 · #003F63 · #271D00 · #000103

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

The five colors

• Cream (#F7EEDF): A whisper-light, dusty gold — the color of afternoon light on wheat.
• Bronze (#5E4900): A full-bodied, balanced gold — the color of old brass.
• Navy (#003F63): A deep, shadowed, balanced blue — the color of deep harbor water.
• Onyx (#271D00): A deep, shadowed, dusty green — the color of fresh herbs.
• Black (#000103): a grounded near-black with real depth.

Feels like: Nature, Growth, Trust, Stability, Optimism, Sophistication. Tagged 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

• Cocoa Courtyard color palette (#FFE9DC, #802E00, #004257, #380F00, #000102)
• Deep Navy Boulevard color palette (#ECE0D1, #6D4900, #00358F, #2E1C00, #000419)
• Softworn Orchard color palette (#DCF0DD, #8E6100, #005699, #3C2600, #000104)
• Aubergine Harbor color palette (#EDE6CF, #524F00, #62006A, #212000, #030004)
• Ancient Summit color palette (#E3EAD3, #006E3A, #6C0097, #003318, #06000C)
• Cellar Aubergine Field color palette (#EEE0D6, #5A2F00, #350084, #36003D, #030100)
• Grape Thicket color palette (#F6EDD5, #756E00, #8800A4, #3C3800, #110017)
• Moonless Lapis Cabin color palette (#F7EAFF, #2F29FB, #625000, #0C0D06, #020100)

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