Cocoa Workshop color palette — #FAF4EF · #C8DFCC · #9DB88D · #9E7B80 · #584300

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

The five colors

• Ivory (#FAF4EF): a clean, paper-quiet neutral.
• Celadon Mist (#C8DFCC): A whisper-light, dusty teal — the color of sea glass.
• Sage (#9DB88D): A luminous, dusty green — the color of new leaves after rain.
• Mocha (#9E7B80): A luminous, dusty red — the color of late-summer berries.
• Deep Olive (#584300): A deep, shadowed, balanced gold — the color of old brass.

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

• Weathered Fern color palette (#F8F5EC, #B8E6DB, #71BFB2, #708D84, #434C00)
• Worn Parlor color palette (#FCF3EA, #E9E9B7, #7FAC79, #8C6B7C, #3A3831)
• Hushed Canyon color palette (#EFF8F0, #A3CBBB, #6D8A68, #5F657A, #3F524A)
• Oat Boulevard color palette (#FFF1F2, #FFD2D9, #B6D992, #C083B0, #47473F)
• Hushed Corridor color palette (#FFF1F4, #E3D9D2, #D4B1CD, #A1B2AF, #5E4B4B)
• Tempered Ridge color palette (#F4F2E5, #C6C5AA, #838841, #566657, #32312B)
• Dusty Jade Drift color palette (#FBF3F0, #BFE3EA, #A9C6F7, #6AA17A, #594659)
• Wisteria Field color palette (#FFF0FC, #E8D3E8, #CE99E7, #A06A89, #674641)

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