Cocoa Loft color palette — #FFF1F1 · #E6D6D0 · #DE9A96 · #A26750 · #5E3200

Cocoa and Walnut set the tone — five colors that lean into optimism and warmth.

The five colors

• Ivory (#FFF1F1): a clean, paper-quiet neutral.
• Bone (#E6D6D0): bright and airy, almost weightless.
• Rosewood Mist (#DE9A96): A luminous, balanced orange — the color of autumn markets.
• Walnut (#A26750): A full-bodied, balanced orange — the color of toasted spice.
• Cocoa (#5E3200): A deep, shadowed, balanced gold — the color of afternoon light on wheat.

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

Use it as a design system

One click turns Cocoa Loft 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 Station color palette (#FFF1F6, #FECDCC, #E4A2A1, #C97F4E, #534200)
• Garnet Field color palette (#FFF1F7, #E9D8E0, #D59FC8, #A2667A, #651D27)
• Bronze Meadow color palette (#FFF2EE, #E0DBCE, #CBA97A, #857132, #414100)
• Bronze Cabin color palette (#FFF1F1, #FF9A75, #B45C00, #553600, #1B1600)
• Ember Meadow color palette (#F8F2FF, #ECAFB8, #C16A65, #8C4A29, #6A3C00)
• Weathered Rust color palette (#EFF1FF, #DDA8C6, #B96762, #79411A, #322900)
• Worn Coral color palette (#FFF2ED, #EB928F, #7B4517, #332824, #140E0C)
• Aged Boulevard color palette (#FFF2EF, #FFC1A1, #BC7D33, #674C00, #211F00)

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