Stylogeny combining Corporate Memphis × Isometric Tech Illustration

Try

Style combination · Pairs well

Corporate Memphis × Isometric Tech Illustration

Its rubbery flat figures often stand inside isometric scenes on the same landing page; keep them small so the grid still rules.

From the research on Isometric Tech Illustration

Mix them and make something Corporate Memphis Isometric Tech Illustration

HelloCorporate Memphis × Isometric Tech2017 · 2015
A sample layout drawn from the recipe: shapes from Corporate Memphis, their arrangement from Isometric Tech Illustration, the finish from Corporate Memphis. Not a real work, and not an image of either style.

01

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.

Corporate Memphis Isometric Tech Illustration

Type from Isometric Tech Illustration
Colour from Corporate Memphis
Form from Corporate Memphis
Composition from Isometric Tech Illustration
Surface from Corporate Memphis

02

The type

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

Display · Isometric Tech Illustration

Hello

Inter Tight, standing in for Geometric and neo-grotesque web sans-serifs set flat beside the drawing, such as those of the SaaS interfaces the illustrations sit in (a working recommendation: the style has no settled typographic canon)

Text · Corporate Memphis

The flat vector illustration style that became the default visual voice of big tech in the late 2010s: faceless, ethnically non-specific figures with elongated limbs and tiny heads, drawn in bright flat colour among blobs, leaves and confetti. Codified in Buck's Alegria system for Facebook (2017) and spread by open libraries such as unDraw and Humaaans, it was later named, half-mockingly, after the Memphis Group.

Hanken Grotesk; Corporate Memphis used Circular and Airbnb Cereal

03

The colours

The ground and leading colours come from Corporate Memphis, with a counter-accent from Isometric Tech Illustration. The ink reads on the ground at 4.5:1 or more.

Corporate Memphis Isometric Tech Illustration

  • #ffffff ground · 36%
  • #2f2e41 ink · 14%
  • #ffc857 accent · 18%
  • #6c63ff accent · 14%
  • #ff7f6e accent · 10%
  • #3ec7b0 accent · 8%

As CSS

:root {
  --ground: #ffffff;
  --ink: #2f2e41;
  --accent-1: #ffc857;
  --accent-2: #6c63ff;
  --accent-3: #ff7f6e;
  --accent-4: #3ec7b0;
  --font-display: "Inter Tight", sans-serif;
  --font-text: "Hanken Grotesk", sans-serif;
}

05

More combinations

With Corporate Memphis

All 28 combinations with Corporate Memphis

With Isometric Tech Illustration

Every style combination