Cocoa Lagoon color palette — #F7F6E9 · #CDDDA8 · #F3B5B0 · #A0B172 · #77391F

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

The five colors

• Ivory (#F7F6E9): bright and airy, almost weightless.
• Celadon Mist (#CDDDA8): A whisper-light, dusty green — the color of fresh herbs.
• Rose Quartz (#F3B5B0): A whisper-light, dusty orange — the color of toasted spice.
• Sage (#A0B172): A luminous, balanced green — the color of fresh herbs.
• Bronze (#77391F): A full-bodied, balanced orange — the color of sun-warmed clay.

Feels like: Nature, Growth, Optimism, Sophistication, Softness, Clarity. Tagged light, 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

• Aged Cocoa Drift color palette (#FFF3E9, #EFD4BA, #D1AE93, #A78B7A, #653E00)
• Ancient Taupe Thicket color palette (#FFF3E4, #EED0A4, #8ED8C3, #C9A165, #445339)
• Weathered Moss Summit color palette (#F7F6E8, #BBCD96, #BDA4DE, #82964E, #66404F)
• Teal Harbor color palette (#F2F8E6, #A6E6C0, #A1CAFF, #78B993, #5C435D)
• Teal Alley color palette (#EDF9EA, #70E3D3, #DCB964, #00B7A6, #543F03)
• Olive Meadow color palette (#F3F7ED, #E9DEB6, #7DAB8D, #647532, #2A2D24)
• Weathered Hollow color palette (#F5F9D6, #B0ECD4, #A3C899, #76986A, #35362F)
• Tangerine Drift color palette (#D9E3C1, #5DC885, #E8832B, #009C54, #411E00)

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