Cocoa Terrace color palette — #F7D8E3 · #643800 · #004124 · #001B3F · #0A0300

Bronze and Forest set the tone — five colors that lean into nature and growth.

The five colors

• Shell Pink (#F7D8E3): A whisper-light, dusty rose — the color of strawberry cream.
• Bronze (#643800): A deep, shadowed, balanced gold — the color of honey in a jar.
• Forest (#004124): A deep, shadowed, dusty teal — the color of glacier melt.
• Midnight (#001B3F): A deep, shadowed, dusty blue — the color of deep harbor water.
• Ink (#0A0300): A deep, shadowed, dusty gold — the color of afternoon light on wheat.

Feels like: Nature, Growth, Trust, Stability, Optimism, Sophistication. Tagged dark, muted.

Use it as a design system

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

• Nocturne Onyx color palette (#EFDAE0, #4E2E00, #002F1E, #0B003D, #070100)
• Twilit Balcony color palette (#F3E7F7, #7F003F, #323B00, #002127, #0F0004)
• Onyx Parlor color palette (#F6E8D6, #874200, #313300, #1D0048, #130900)
• Charred Parlor color palette (#D8EEE7, #384C00, #003E42, #25004F, #030600)
• Basalt Lantern color palette (#EEE4E7, #9DAEA2, #63887C, #532C00, #200C15)
• Antique Atelier color palette (#D2F0E1, #696300, #00605C, #003C4C, #050500)
• Terracotta Grove color palette (#E7DAE3, #A9432D, #203C00, #4C0A00, #000202)
• Gentle Pier color palette (#CBE4E1, #0B791D, #005F62, #410088, #032205)

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