Cocoa Workshop color palette — #F9F5EB · #C5DFCC · #B6AF8D · #997F78 · #564400

Deep Olive takes the lead with Sage close behind in a set that reads as nature and growth at first glance.

The five colors

• Ivory (#F9F5EB): bright and airy, almost weightless.
• Celadon Mist (#C5DFCC): A whisper-light, dusty teal — the color of sea glass.
• Sage (#B6AF8D): A luminous, dusty green — the color of a quiet forest floor.
• Mocha (#997F78): A luminous, dusty orange — the color of toasted spice.
• Deep Olive (#564400): A deep, shadowed, balanced green — the color of fresh herbs.

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

Use it as a design system

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

• Hushed Fern Coast color palette (#F4F7ED, #B7E3DF, #84BCAD, #6F8E81, #374F0C)
• Bronze Workshop color palette (#F4F7EB, #C2E8CF, #6BAD98, #986C30, #2E3F00)
• Driftwood Ridge color palette (#F0F7F2, #A8CAB9, #7E8659, #735D74, #405249)
• Hushed Studio color palette (#FFF2F0, #EDD4CE, #E49BA5, #A26769, #7B3D23)
• Worn Oat color palette (#FFF2EE, #F2D4C5, #C8D392, #C98486, #48463F)
• Washed Bloom color palette (#FAF6E2, #ACC58F, #578447, #714333, #111D00)
• Wandering Orchard color palette (#EEDFC7, #A38D2B, #545000, #4A1B00, #020100)
• Hushed Stone color palette (#FFF2EC, #E2D9D0, #E4A79A, #8F584D, #3D1E0E)

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