Midnight Cocoa color palette — #F6E3D4 · #703500 · #003D54 · #00202E · #02000C

Bronze and Deep Teal set the tone — five colors that lean into trust and stability.

The five colors

• Parchment (#F6E3D4): A whisper-light, dusty gold — the color of old brass.
• Bronze (#703500): A deep, shadowed, balanced gold — the color of afternoon light on wheat.
• Deep Teal (#003D54): A deep, shadowed, dusty blue — the color of a favorite pair of jeans.
• Midnight (#00202E): A deep, shadowed, dusty blue — the color of open sky before noon.
• Black (#02000C): A deep, shadowed, dusty violet — the color of a velvet chair.

Feels like: Trust, Stability, Optimism, Sophistication, Depth, Luxury. Tagged jewel, vibrant, dark, muted.

Use it as a design system

One click turns Midnight 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

• Fern Courtyard color palette (#F2EDD9, #474C00, #003B38, #002228, #070000)
• Obsidian Terracotta Station color palette (#FFE5D3, #8E3C00, #004047, #1E004E, #02000C)
• Garnet Parlor color palette (#FFE5E0, #86003B, #003A2F, #001F18, #000205)
• Bronze Cabin color palette (#FFDAD7, #A25D00, #584400, #132500, #000402)
• Obsidian Pier color palette (#F1DFF7, #62002D, #001A2B, #09002C, #050004)
• Muted Balcony color palette (#F1E7CD, #7F6600, #092BC1, #102C7C, #160011)
• Antique Cocoa Hollow color palette (#EBDFD5, #AFA38D, #8A8864, #6C3300, #110701)
• Hushed Pine color palette (#DFE4D0, #00732C, #003C79, #002753, #070000)

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