Cocoa Lagoon color palette — #F8DCEE · #9881A4 · #7A5D7C · #5A3A00 · #292100

Built around Cocoa, softened by Graphite — the whole palette hums with nature and growth.

The five colors

• Blush (#F8DCEE): A whisper-light, dusty pink — the color of peonies in June.
• Heather (#9881A4): A luminous, dusty violet — the color of a velvet chair.
• Graphite (#7A5D7C): A full-bodied, dusty pink — the color of a candy shop window.
• Cocoa (#5A3A00): A deep, shadowed, dusty gold — the color of old brass.
• Onyx (#292100): A deep, shadowed, dusty green — the color of new leaves after rain.

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

Use it as a design system

One click turns Cocoa Lagoon 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 Lantern color palette (#EFE5FF, #AE9BB8, #956567, #5D441A, #08301D)
• Ancient Garnet color palette (#DEE4FB, #968EBC, #7C588C, #69222A, #390B00)
• Cocoa Terrace color palette (#FFE9F0, #9E6B72, #7F3B2E, #342900, #111300)
• Patina Study color palette (#EDDCDB, #C08069, #985922, #384600, #052E02)
• Dusty Fern color palette (#DFF2FF, #A8BAE1, #9B759A, #426922, #002D29)
• Gentle Mulberry Boulevard color palette (#EAE2F5, #AE6097, #906000, #7B0063, #1C0F00)
• Worn Drift color palette (#FFEBF6, #E3C6D2, #879A88, #417069, #294C4D)
• Forest Terrace color palette (#F7E4D3, #8CAF92, #877F4F, #005F45, #003732)

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