American Mid-Century Modernism × Brodovitch Editorial Design

Rand and Lustig build flat geometric pictograms; Brodovitch builds sequences of grainy photographs.

From the research on Brodovitch Editorial Design (Harper's Bazaar)

Mix them and make something American Mid-Century Modernism Brodovitch Editorial Design

A sample layout drawn from the recipe: shapes from American Mid-Century Modernism, their arrangement from Brodovitch Editorial Design, the finish from Brodovitch Editorial Design. Not a real work, and not an image of either style.

What each style brings

Each part of the design comes from the style with the stronger say in it, and each style gives at least two.

American Mid-Century Modernism Brodovitch Editorial Design (Harper's Bazaar)

Type from American Mid-Century Modernism: Geometric sans
Hand-lettering
Colour from American Mid-Century Modernism: Limited spot colours
Flat fields
Form from American Mid-Century Modernism: Geometric primitives
Biomorphic curves
Composition from Brodovitch Editorial Design: Dynamic asymmetry
Full bleed
Surface from Brodovitch Editorial Design: Grain & noise

The type

Open fonts standing in for each style’s own type, which is often hand-drawn or commercial.

Display · American Mid-Century Modernism

Pop

Jost, standing in for Futura

Text · Brodovitch Editorial Design

A magazine-spread idiom in which the photograph is treated as a cinematic sequence: bled, unexpectedly cropped, grainy and blurred images set against generous white space, a Didone masthead and an expressive second colour that varied by issue. Improvised rather than gridded, it made the fashion magazine an art-directed object and shaped a generation of photographers.

Bodoni Moda; Brodovitch Editorial Design used Didot and Al-Bro

The colours

The ground and leading colours come from American Mid-Century Modernism, with a counter-accent from Brodovitch Editorial Design. The ink reads on the ground at 4.5:1 or more.

American Mid-Century Modernism Brodovitch Editorial Design (Harper's Bazaar)

#f2ede1 ground · 36%
#1a1a1a ink · 14%
#e2a83a accent · 18%
#d3202f accent · 14%
#e8b4b8 accent · 10%
#2f5f8a accent · 8%

As CSS

:root {
  --ground: #f2ede1;
  --ink: #1a1a1a;
  --accent-1: #e2a83a;
  --accent-2: #d3202f;
  --accent-3: #e8b4b8;
  --accent-4: #2f5f8a;
  --font-display: "Jost", sans-serif;
  --font-text: "Bodoni Moda", serif;
}

The two styles

A backpacked hiker stands on a steep, black-and-cream rocky summit against a large golden sun, with blue mountain ranges, forests and pale waterways below. Large condensed lettering at the upper left reads “HIGHER GROUND” in black and red.

1940–1970 · North America American Mid-Century Modernism The American synthesis of European avant-garde form with wit, pragmatism and commercial clients, led by Paul Rand, Alvin Lustig, Lester Beall, Bradbury Thompson and Saul Bass. Asymmetric layouts, cut-paper and collaged shapes, photomontage, playful hand-drawn marks and a few bright flat colours turned book jackets, magazines, advertising, film titles and corporate work into idea-driven visual puns.

A grainy black-and-white close-up of a woman fills the left side, with a translucent red scarf sweeping across the top against a cream background. Tall serif lettering reads “FAR LIGHT” above three small photographs of a woman running along a wet terrace.

1934–1958 · North America Brodovitch Editorial Design (Harper's Bazaar) A magazine-spread idiom in which the photograph is treated as a cinematic sequence: bled, unexpectedly cropped, grainy and blurred images set against generous white space, a Didone masthead and an expressive second colour that varied by issue. Improvised rather than gridded, it made the fashion magazine an art-directed object and shaped a generation of photographers.

More combinations

With American Mid-Century Modernism

With Brodovitch Editorial Design

Every style combination