Cocoa Coast color palette — #E1F1F7 · #9F839F · #7D5A6A · #5A2E00 · #271B00

Built around Cocoa, softened by Heather — the whole palette hums with optimism and sophistication.

The five colors

• Frost (#E1F1F7): a clean, paper-quiet neutral.
• Heather (#9F839F): A luminous, dusty pink — the color of neon signs at night.
• Graphite (#7D5A6A): A full-bodied, dusty rose — the color of pressed rose petals.
• Cocoa (#5A2E00): A deep, shadowed, balanced gold — the color of afternoon light on wheat.
• Onyx (#271B00): A deep, shadowed, dusty gold — the color of old brass.

Feels like: Optimism, Sophistication. Tagged vintage, retro, muted.

Use it as a design system

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

• Antique Fern color palette (#DCDFFD, #A889B9, #8F5D75, #4F4B00, #052A01)
• Weathered Garnet color palette (#DCEFEF, #709A85, #755672, #5F292D, #3A1500)
• Cobalt Terrace color palette (#CDE7FE, #6973AA, #654C6F, #432500, #131000)
• Antique Driftwood Drift color palette (#DFF0F8, #94AAC4, #7E70A8, #825134, #4A3600)
• Tempered Chestnut color palette (#D7FFF5, #99C9E2, #9382B7, #6D5803, #312F28)
• Weathered Canyon color palette (#FFE2FD, #D6B3C4, #9C8185, #744E00, #37362F)
• Fern Delta color palette (#CCF6F1, #719FB0, #54668D, #405114, #073F31)
• Patina Bronze color palette (#F4E5F9, #CB9AB1, #A7644A, #3C562E, #003628)

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