Cocoa Market color palette — #FAF4EE · #C6E0CC · #AFB289 · #977D8A · #574400

A conversation between Deep Olive and Sage, giving this palette its sense of nature and growth.

The five colors

• Ivory (#FAF4EE): bright and airy, almost weightless.
• Celadon Mist (#C6E0CC): A whisper-light, dusty teal — the color of sea glass.
• Sage (#AFB289): A luminous, dusty green — the color of a quiet forest floor.
• Heather (#977D8A): A luminous, dusty rose — the color of pressed rose petals.
• Deep Olive (#574400): A deep, shadowed, balanced green — the color of a quiet forest floor.

Feels like: Nature, Growth, Optimism, Sophistication, Grounding. Tagged botanical, earthy, muted, light.

Use it as a design system

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

• Softworn Stone color palette (#F1F7F2, #CBE5D8, #94C1B3, #9498B4, #3C5348)
• Washed Studio color palette (#F7F6E7, #C0EACF, #60ADAE, #906C6C, #2E4000)
• Aged Cocoa Grove color palette (#FFF1F3, #FDD0D3, #E79CA5, #A86F5C, #6F4000)
• Worn Balcony color palette (#FBF3F5, #A6CBB6, #6D8C5C, #60647B, #415248)
• Softworn Balcony color palette (#FFF2EB, #E3D9D2, #D99D8D, #925A4B, #4F2000)
• Hushed Workshop color palette (#FFF2ED, #F2D4C4, #8BDCDD, #D08080, #314F32)
• Jade Corridor color palette (#FFF3E3, #D1E299, #5AA573, #70628E, #2B3209)
• Timeworn Alley color palette (#FFF2ED, #E0DBCE, #DEB7BE, #9CC5C1, #7A401B)

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