Cocoa Ridge color palette — #FFF2ED · #F0D6C1 · #E8A08B · #9D6955 · #6D3901

Bronze and Melon set the tone — five colors that lean into optimism and warmth.

The five colors

• Ivory (#FFF2ED): bright and airy, almost weightless.
• Bone (#F0D6C1): A whisper-light, dusty gold — the color of old brass.
• Melon (#E8A08B): A luminous, balanced orange — the color of sun-warmed clay.
• Walnut (#9D6955): A full-bodied, dusty orange — the color of autumn markets.
• Bronze (#6D3901): A full-bodied, balanced gold — the color of afternoon light on wheat.

Feels like: Optimism, Warmth, Comfort, Sophistication. Tagged light, muted, warm.

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

• Stone Summit color palette (#FFF3E9, #DFDAC8, #D8A775, #A27E4B, #524D47)
• Chestnut Summit color palette (#FFF3E8, #DFD9CD, #D9A584, #895B3B, #452307)
• Washed Studio color palette (#FFDEC9, #F3983B, #B26D00, #634200, #2F2000)
• Stone Lagoon color palette (#FFF1F2, #FFD3ED, #DD9BBC, #9E687E, #694843)
• Muted Market color palette (#F7E7FF, #E4A0A3, #C1684E, #875130, #2A3F2A)
• Wandering Amber color palette (#FFF2EC, #FFAE79, #DC7A00, #834F00, #482D00)
• Tempered Taupe color palette (#FFF4DA, #E6D083, #ADA146, #787722, #3B3F16)
• Stone Veranda color palette (#FFF3E9, #F7BE99, #B2C47E, #C98DAB, #3D3732)

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