Cocoa Courtyard color palette — #FDF3EB · #E8D6C1 · #CFAF94 · #B98372 · #5F4200

A conversation between Bronze and Caramel, giving this palette its sense of optimism and sophistication.

The five colors

• Ivory (#FDF3EB): a clean, paper-quiet neutral.
• Bone (#E8D6C1): A whisper-light, dusty gold — the color of old brass.
• Rosewood Mist (#CFAF94): A luminous, dusty gold — the color of old brass.
• Caramel (#B98372): A luminous, dusty orange — the color of sun-warmed clay.
• Bronze (#5F4200): A full-bodied, balanced gold — the color of old brass.

Feels like: Optimism, Sophistication, Grounding. Tagged earthy, warm, light, 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

• Worn Stone Grove color palette (#FFF0F7, #C7F4EA, #D5A280, #8A7089, #30443C)
• Patina Stone Grove color palette (#FDEDF3, #D4B591, #9A7787, #66505E, #242F27)
• Pale Coast color palette (#FDECD4, #DCC77F, #D1982A, #B96800, #383808)
• Patina Moss Market color palette (#FBF2FA, #A2C1F0, #DA9177, #85913B, #2D3C30)
• Bronze Boulevard color palette (#FFE7D1, #AE8949, #9D5C00, #7E3200, #0F0B00)
• Ancient Amber color palette (#F5EAD6, #B9B574, #AB8A21, #915F0B, #202800)
• Periwinkle Delta color palette (#F8F3F8, #F0D3F1, #D7A4CF, #77AEF3, #3B282A)
• Wisteria Atelier color palette (#FFF0FB, #F8CCE5, #C8AEEA, #B471B7, #722B55)

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