Tempered Cocoa color palette — #E7ECDE · #007248 · #803200 · #382300 · #000201

Rust and Pine set the tone — five colors that lean into nature and growth.

The five colors

• Parchment (#E7ECDE): bright and airy, almost weightless.
• Pine (#007248): A full-bodied, balanced teal — the color of glacier melt.
• Rust (#803200): A full-bodied, balanced orange — the color of autumn markets.
• Espresso (#382300): A deep, shadowed, dusty gold — the color of afternoon light on wheat.
• Black (#000201): quiet, heavy and certain.

Feels like: Nature, Growth, Optimism, Sophistication. Tagged muted.

Use it as a design system

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

• Weathered Cocoa color palette (#DBECDC, #006E70, #634900, #292A00, #000202)
• Feathered Boulevard color palette (#EDEAC8, #516A00, #91003F, #481500, #010100)
• Nocturne Abyss Market color palette (#C9EAF9, #004B62, #4F2D00, #2C1600, #000102)
• Petrol Cabin color palette (#D9F6EA, #007CAA, #5F6600, #00451E, #000103)
• Chalky Boulevard color palette (#D6F0E0, #008AA4, #D2002B, #635400, #000608)
• Magenta Orchard color palette (#FFF1F3, #CF55DE, #CF5000, #724C00, #1A001E)
• Quiet Amber Field color palette (#E4FDE6, #00BDC4, #BC8700, #646E00, #002022)
• Wandering Olive color palette (#DCFFEE, #0097C6, #737F00, #005E21, #00090F)

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