Cocoa Terrace color palette — #F5DEC2 · #ABA981 · #678666 · #7F4027 · #563600

Built around Bronze, softened by Cocoa — the whole palette hums with nature and growth.

The five colors

• Peach Cream (#F5DEC2): A whisper-light, dusty gold — the color of afternoon light on wheat.
• Sage (#ABA981): A luminous, dusty green — the color of fresh herbs.
• Fern (#678666): A full-bodied, dusty green — the color of a quiet forest floor.
• Bronze (#7F4027): A full-bodied, balanced orange — the color of sun-warmed clay.
• Cocoa (#563600): A deep, shadowed, dusty gold — the color of honey in a jar.

Feels like: Nature, Growth, Optimism, Sophistication. Tagged vintage, retro, 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

• Tempered Garden color palette (#F0EFD2, #72B19C, #568576, #7A3E1C, #3E3A34)
• Tempered Workshop color palette (#E0E1CE, #8BC7A9, #7F9982, #815865, #603C3D)
• Garnet Ridge color palette (#F3E2CD, #738D55, #006267, #5C2214, #341B00)
• Hushed Bronze Studio color palette (#F6F7E6, #B8CCB2, #A0839F, #93632A, #5B4F00)
• Soft Terrace color palette (#ECF2CD, #63C0CF, #677FB6, #66591B, #374A1F)
• Teal Terrace color palette (#D9F6EF, #71BA9A, #468487, #514E68, #2C1E38)
• Weathered Grove color palette (#E4F2E7, #5FA3AA, #5C689A, #3D4C13, #023A1D)
• Feathered Brick color palette (#DEEBC7, #00905E, #C71E1D, #9B330F, #272F14)

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