Charred Cocoa color palette — #F2D8E3 · #693600 · #403F00 · #180C00 · #0A0004

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

The five colors

• Shell Pink (#F2D8E3): A whisper-light, dusty rose — the color of pressed rose petals.
• Bronze (#693600): A deep, shadowed, balanced gold — the color of afternoon light on wheat.
• Deep Olive (#403F00): A deep, shadowed, dusty green — the color of new leaves after rain.
• Ink (#180C00): A deep, shadowed, dusty gold — the color of old brass.
• Ink (#0A0004): A deep, shadowed, dusty rose — the color of pressed rose petals.

Feels like: Nature, Growth, Optimism, Sophistication, Depth, Luxury. Tagged noir, dark, luxury, muted.

Use it as a design system

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

• Velvet Cocoa color palette (#F2E4ED, #792500, #2D2A1E, #1C0800, #090100)
• Aged Delta color palette (#F0DFE7, #B95C00, #494319, #2D1321, #040104)
• Dusty Chestnut Lagoon color palette (#F9E9DC, #934A00, #3A4942, #2E2300, #120600)
• Hushed Fern color palette (#DEF6EC, #5B6000, #005B4F, #652800, #121300)
• Ancient Bronze color palette (#E9F5EE, #8C7E04, #224438, #202C25, #0F1716)
• Wandering Mulberry color palette (#E5F4E8, #886800, #9F0069, #483600, #360021)
• Ancient Bronze color palette (#DAEADD, #8C7923, #4B4700, #4F1D00, #002211)
• Lowlit Corridor color palette (#CEE4DD, #5A7400, #143305, #001E17, #00090A)

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