Cocoa Courtyard color palette — #F2DDEC · #B97886 · #7E432D · #393C35 · #182F12

Built around Coffee, softened by Dusty Rose — the whole palette hums with nature and growth.

The five colors

• Rose Water (#F2DDEC): A whisper-light, dusty pink — the color of peonies in June.
• Dusty Rose (#B97886): A luminous, balanced red — the color of embers at dusk.
• Coffee (#7E432D): A full-bodied, balanced orange — the color of sun-warmed clay.
• Charcoal (#393C35): a grounded near-black with real depth.
• Deep Forest (#182F12): A deep, shadowed, dusty green — the color of new leaves after rain.

Feels like: Nature, Growth, Optimism, Sophistication. Tagged vintage, retro, muted.

Use it as a design system

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

• Wandering Rust color palette (#F3E4E9, #B4615E, #7A420F, #004035, #002C30)
• Driftwood Orchard color palette (#EBEAFF, #9967A9, #824065, #3E3D00, #003023)
• Muted Olive Quarry color palette (#F6E8F3, #CE9580, #AE7F53, #536F29, #013608)
• Weathered Bronze Boulevard color palette (#FED7DC, #D6856B, #976400, #00574F, #1B3A58)
• Chestnut Workshop color palette (#FFEBE6, #8E5B2A, #4E3E02, #00272C, #00111F)
• Taupe Canyon color palette (#FFF2ED, #D1B9A8, #A8977B, #607061, #3C5050)
• Airy Ember Delta color palette (#F2DAD3, #E24A2D, #7D2300, #390900, #1A0300)
• Muted Bronze Alley color palette (#F3E0C6, #8A7B00, #404B00, #34254B, #1F1B00)

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