Weathered Veranda color palette — #FDF2F0 · #E1DCCF · #A9757E · #5A3E38 · #211917

A conversation between Mocha and Cocoa, giving this palette its sense of sophistication.

The five colors

• Ivory (#FDF2F0): a clean, paper-quiet neutral.
• Bone (#E1DCCF): a clean, paper-quiet neutral.
• Mocha (#A9757E): A luminous, dusty red — the color of a theater curtain.
• Cocoa (#5A3E38): A deep, shadowed, dusty orange — the color of autumn markets.
• Ink (#211917): quiet, heavy and certain.

Feels like: Sophistication. Tagged luxury, dark, muted.

Use it as a design system

One click turns Weathered Veranda 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

• Bronze Terrace color palette (#FFF3E7, #E3E4B0, #9A6A3D, #522F00, #170D04)
• Muted Shell Courtyard color palette (#FFF2EF, #FFA6B6, #C4AB72, #9A758B, #3E2D29)
• Timeworn Summit color palette (#FEF2F1, #F3DAB4, #C08EA2, #836462, #342827)
• Worn Pewter Veranda color palette (#F4F0F8, #AECCB4, #815065, #3A2846, #18111C)
• Softworn Marigold color palette (#FDEADB, #D89100, #5E2C00, #1D251F, #110400)
• Weathered Stone color palette (#FFF2ED, #E3D9C7, #D9A579, #9A7140, #583F00)
• Hushed Sand Harbor color palette (#FFF2EA, #FFC37B, #964C2A, #3D1F09, #090200)
• Velvet Market color palette (#F6D6CC, #B36300, #3B000D, #100802, #040000)

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