Cocoa Study color palette — #FBF4ED · #C5E1CC · #AEB28C · #987C8D · #564400

Built around Deep Olive, softened by Sage — the whole palette hums with nature and growth.

The five colors

• Ivory (#FBF4ED): bright and airy, almost weightless.
• Celadon Mist (#C5E1CC): A whisper-light, dusty teal — the color of sea glass.
• Sage (#AEB28C): A luminous, dusty green — the color of new leaves after rain.
• Heather (#987C8D): A luminous, dusty pink — the color of neon signs at night.
• 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 Study 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

• Worn Study color palette (#F0F8F1, #CCE5D8, #90C2B2, #9697B5, #3B5348)
• Aged Meadow color palette (#FBF4EB, #E6EABA, #82AA85, #916979, #3A3831)
• Tempered Cocoa Loft color palette (#FFF1F3, #F0D3D1, #E89D9E, #A56E55, #6D4100)
• Softworn Driftwood color palette (#FDF2F5, #A7CBB7, #6C8C5E, #5E657C, #425149)
• Stone Courtyard color palette (#FFF2EB, #E0D8CE, #E09E8D, #915B45, #3F200E)
• Tempered Ridge color palette (#FFF2EF, #F5D3C7, #89D8F7, #D17E8C, #26503D)
• Dusty Market color palette (#FFF2ED, #FBB7B6, #7BC6E7, #75ABC2, #4A3229)
• Chalky Jade color palette (#FFF4E1, #C7E59C, #31AA76, #785E8F, #243500)

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