Cocoa Study color palette — #F5ECE4 · #D5CFC1 · #A6AA86 · #704000 · #050200

Bronze and Sage set the tone — five colors that lean into optimism and sophistication.

The five colors

• Cream (#F5ECE4): a clean, paper-quiet neutral.
• Oat (#D5CFC1): A whisper-light, dusty gold — the color of honey in a jar.
• Sage (#A6AA86): A luminous, dusty green — the color of new leaves after rain.
• Bronze (#704000): A full-bodied, balanced gold — the color of afternoon light on wheat.
• Ink (#050200): quiet, heavy and certain.

Feels like: Optimism, Sophistication. Tagged scandi, muted, light.

Use it as a design system

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

• Basalt Station color palette (#ECE4DB, #AA9E87, #7C804F, #4C2F00, #080300)
• Patina Garnet Orchard color palette (#F9EAE6, #DCCDC1, #B2A489, #92082A, #080100)
• Dusty Ridge color palette (#F5F7E9, #CEDDD7, #A9C2B3, #3A6E34, #0D0E00)
• Worn Bronze color palette (#E4ECE3, #A0B5B2, #75A3A5, #9B6400, #0A1809)
• Patina Emerald color palette (#E6E1CC, #4FA267, #005A53, #451738, #000200)
• Patina Amber color palette (#FFEAE4, #A48F39, #2B6651, #3F1B44, #0F0012)
• Fern Market color palette (#E9E3C8, #5B4D00, #2F3A39, #0E140F, #000801)
• Aged Market color palette (#FFF1D8, #FF8984, #AC8C00, #007459, #010100)

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