Patina Cocoa color palette — #F2F4FF · #DBD8FE · #AAA0C0 · #89584C · #5D3619

Cocoa and Pewter set the tone — five colors that lean into optimism and sophistication.

The five colors

• Ivory (#F2F4FF): a clean, paper-quiet neutral.
• Thistle (#DBD8FE): A whisper-light, dusty violet — the color of wild irises.
• Mauve (#AAA0C0): A luminous, dusty violet — the color of twilight just after sunset.
• Pewter (#89584C): A full-bodied, dusty orange — the color of sun-warmed clay.
• Cocoa (#5D3619): A deep, shadowed, dusty gold — the color of honey in a jar.

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

Use it as a design system

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

• Timeworn Lantern color palette (#F4F4FF, #D2C7EC, #AD98BA, #875F72, #304A30)
• Basalt Hollow color palette (#FBD3EE, #AAA1D2, #8A6C97, #6E4C41, #533900)
• Ancient Meadow color palette (#EEEBFB, #BE9CCE, #9E6192, #652A1E, #2C1200)
• Muted Pier color palette (#E9E1FF, #AE7896, #904256, #452700, #0F0900)
• Washed Courtyard color palette (#FFF0F8, #E7AFC0, #C66B6E, #775800, #363000)
• Worn Taupe Study color palette (#FFF1F4, #FEC7C4, #C98F7B, #827B43, #454E20)
• Weathered Taupe Boulevard color palette (#F8F2FF, #E8D5DD, #D1B9CD, #799D83, #3E534A)
• Patina Cocoa Pier color palette (#F5DDE1, #9E6D6D, #79422B, #221E00, #010200)

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