Twilit Cocoa color palette — #F1E1D4 · #7F3F00 · #32423B · #201700 · #060100

A conversation between Bronze and Ink, giving this palette its sense of optimism and sophistication.

The five colors

• Parchment (#F1E1D4): A whisper-light, dusty gold — the color of old brass.
• Bronze (#7F3F00): A full-bodied, balanced gold — the color of old brass.
• Charcoal (#32423B): A deep, shadowed, dusty teal — the color of shallow lagoons.
• Ink (#201700): A deep, shadowed, dusty gold — the color of afternoon light on wheat.
• Black (#060100): A deep, shadowed, dusty orange — the color of sun-warmed clay.

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

Use it as a design system

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

• Obsidian Ridge color palette (#F7E5DE, #9D001D, #2F3B30, #281200, #070100)
• Ancient Pier color palette (#F6E7EE, #A25100, #393300, #22110F, #14000A)
• Midnight Fern color palette (#FAEECE, #5C5400, #1A2626, #051F00, #030300)
• Antique Fern Garden color palette (#FEE7F0, #6A681D, #582C00, #312815, #0F0600)
• Olive Bloom color palette (#ECECD4, #406F00, #3E4B4E, #002C1F, #0A0A00)
• Hushed Garden color palette (#EBE0C6, #998700, #314E21, #312504, #1A0F04)
• Worn Market color palette (#F8F1E8, #BF934C, #685700, #3C3731, #26201D)
• Powdered Atelier color palette (#F0E0CB, #8F8626, #3C5E00, #54214D, #121000)

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