Cocoa Ridge color palette — #FFF1F2 · #D5BCB9 · #9C8B7C · #88697E · #804224

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

The five colors

• Ivory (#FFF1F2): bright and airy, almost weightless.
• Stone (#D5BCB9): A luminous, dusty orange — the color of sun-warmed clay.
• Gray (#9C8B7C): A luminous, dusty gold — the color of afternoon light on wheat.
• Slate (#88697E): A full-bodied, dusty pink — the color of a candy shop window.
• Bronze (#804224): A full-bodied, balanced orange — the color of autumn markets.

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

Use it as a design system

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

• Hushed Meadow color palette (#FFF1F1, #D3BDBC, #A58981, #537E6E, #634553)
• Timeworn Market color palette (#F6F6EB, #B9C6AD, #4B8D94, #835959, #3B5718)
• Aubergine Delta color palette (#ECE0D4, #847E78, #715823, #482364, #540C1E)
• Washed Studio color palette (#FFE5DB, #B09F8A, #7B823B, #764E50, #6B300E)
• Timeworn Olive color palette (#FFEBE2, #D9AC89, #A7813C, #716800, #4F4F48)
• Fern Chapel color palette (#FEF5D9, #D2CB9E, #8D7D3C, #535100, #3F3D0F)
• Garnet Lantern color palette (#F3DEE6, #BF8B70, #626B42, #67325A, #4D2642)
• Onyx Workshop color palette (#F3DCED, #86584F, #453E07, #2F1044, #240013)

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