Mid century modern colors: palettes with hex codes

Mid century modern colors are the warm, optimistic shades of design from about 1945 to 1969: mustard yellow, burnt orange, teal, olive and avocado green, set against walnut wood and soft cream. They appeared on furniture, kitchens, travel posters, record sleeves and adverts, and they still feel cheerful without being loud. The trick is the neutral: warm wood and cream take most of the space, and two accents do the talking.

The classic mid century modern color palette

Notice how warm everything is. Even the teal and olive are slightly earthy rather than clean and bright. That warmth is what separates mid century colour from later, cooler modernism. If you put this teal next to a cold digital blue you will see it immediately: it looks like it was printed, not lit.

Five mid century palettes with hex codes

Few designs of the period used every colour at once. Most chose a neutral and two or three accents. These five sets cover the moods you will see most often in furniture showrooms, posters and kitchens of the era.

What made mid century design look the way it did

Colour was only part of it. The look came from a whole set of choices that you can borrow alongside the palette.

• Flat colour. Posters and sleeves were printed in a few solid inks, often with visible overlap where two colours met.
• Simple geometric shapes. Circles, boomerangs, starbursts and kidney shapes, often slightly off register.
• Wood everywhere. Teak, walnut and rosewood gave interiors their warm base, so wood tones belong in the palette.
• Clean sans serif type for modern brands, with a friendly brush script for anything playful.
• Optimism. Bright skies, new technology, travel and leisure. The mood is hopeful, never ironic.

For type, geometric sans faces in the spirit of Futura, and the grotesques that came out of Swiss design, carry the modern side. Retro fonts lists free faces that suit the period, including scripts that read well at small sizes.

Overprint: the detail that sells it

Printers of the period often laid one transparent ink over another, so where a mustard circle crossed a teal block a third, darker colour appeared. That overlap is one of the quickest ways to make a digital design feel mid century. On the web you can recreate it with a multiply blend, which darkens shapes where they cross exactly as ink does.

.shape {
  position: absolute;
  border-radius: 50%;
  mix-blend-mode: multiply;
}

.sun  { background: #e1a730; }
.pool { background: #2b7a78; }

/* the overlap prints as a deep olive, like two inks on cream paper */

How to use mid century modern colors today

1. 1

   Start with the neutral

   Cream for a light, poster feel; walnut or espresso for a richer, furniture feel.

2. 2

   Pick a classic pairing

   Mustard and teal, or burnt orange and teal. They are recognisable at a glance.

3. 3

   Keep colour blocks flat

   Solid fills for shapes and type. If you use a gradient, keep it in the background.

4. 4

   Add one period detail

   A circle sun, a starburst behind a price, a script word. One is charming; five is fancy dress.

The palette suits coffee shops, cocktail bars, vintage and homeware shops, record stores, travel brands, architects and anyone selling something made to last. It also prints beautifully, which makes it a good choice for posters and menus. Poster design has layout advice that works with flat mid century colour.

Mid century colours compared with other retro palettes

Mid century sits before the louder decades. The 1970s took its earth tones darker and browner; the 1980s swapped them for neon and pastel; the 90s aesthetic split into grunge, early web and translucent plastic. If you want warmth and optimism without neon, mid century is the decade to borrow from. Retro colour palettes compares them side by side.

If you want your mid century look on a background that nobody else has, browse Gradiently's Marks by colour words like "mustard" or "teal". Any unclaimed Mark is free to design with, and claiming one makes it yours alone.