How to Use IBM Plex: A Excellent Multi-Family Font Perfect for Web Apps and Software Interfaces

IBM Plex Cover

Welcome to Typogram’s FontDiscovery newsletter, written by your resident font and design nerd, Hua. Want to learn more about font and design? Subscribe FontDiscovery to get weekly doses of learning and inspiration♪


In this issue...

How to Use IBM Plex for Logo and Branding

 sample of Plex (serif, sans, and mono)
Sample of IBM Plex

The IBM Plex Family 

Plex is a system of fonts that has sans, serif, and monospaced versions. Plex is extensive because IBM originally designed it as its brand font. IBM wanted to illustrate the themes of mankind and machine. The font mirrored this brand vision by having neutral, balanced yet approachable normal weights and more friendly italics. This highly versatile system of fonts can work for a variety of projects. When used together, they can complement each other to display complex text information for app user interfaces, spreadsheets, or presentations.

Sample of Plex (serif, sans, and mono)
Sample of Plex (serif, sans, and mono)
img: IBM’s internal PowerPoint template using Plex; source: ibm
IBM’s internal PowerPoint template using Plex; source: ibm

What Are Monospaced Fonts?

Monospaced fonts are fixed width. Look at monospaced “1” comparing to the proportional “1”.


Oh, we haven't talked much about monospaced fonts.

So far, the fonts we have covered have been proportional, where each character takes as much width as it needs. Monospaced fonts are fixed width (all of the characters have the same width). Most "typewriter" fonts are monospaced. Also, the fonts you see in code editors, like Courier. 

Monospaced fonts are great for displaying numbers, like prices, playback time, and more, because every single character is the same width, which means, the numbers line up perfectly. Monospaced numbers are also called tabular numbers, because... they are born to be used in tables and spreadsheets. If you are creating a project with numbers and data, try a monospaced font -- you will be pleased.

Top– monospaced; bottom– not monospaced. This is why mono is great for numbers, especially numbers on dynamic labels like these. source: https://blog.usejournal.com/proportional-vs-monospaced-numbers-when-to-use-which-one-in-order-to-avoid-wiggling-labels-e31b1c83e4d0
Top– monospaced; bottom– not monospaced. This is why mono is great for numbers, especially numbers on dynamic labels like these. source: Lior Azi

Plex at a Glance

Plex Mono is perfect for numbers, symbols. It is also great for showing code snippets. Plex Mono Italic has the most personality out of the Plex bunch.

Some excellent features of Plex Mono include:

  • A dotted 0 that differentiates from the letter O.
  • Curved tails in "l," "z," and "Q" for mono italic.

Plex Sans is perfect for presentation and displaying text. It has excellent legibility. This also goes for the Plex Serif, which is more suited for editorial storytelling.

Nice type details of Plex Mono
Type details of Plex Mono

How Should I Use IBM Plex for Logo and Branding? 

As you can already guess: coming from a tech company, Plex has the approachable, accessible tone that many other tech companies enjoy employing in branding. The question is: Can I use it for my own company since it's already associated with another brand? The answer is yes. As you have seen in these examples, Plex has already been open-sourced and free to use. The sans and serif versions are perfect for any company that looks to be open and approachable. The monospace version communicates friendliness. The Monospace Italic is very cutesy. Overall, a highly versatile family of fonts for you to play within your projects.

Hackernoon uses are Plex for its site. The UI texts are Plex Mono. the article is Plex Sans. source: Hackernoon
Hackernoon uses are Plex for its site. The UI texts are Plex Mono. the article is Plex Sans. source: Hackernoon
Hackernoon uses are Plex for its site. The UI texts are Plex Mono. the article is Plex Sans. source: Hackernoon

Logo

Tech companies with open, accessible, or friendly brand personalities. Most of the "friendly" are in the monospace italic of this font.

Typography System & Pairing
(marketing, presentation, and website)

Plex pairs well with each other and has many weights. It can display complex data like pricings. Plex Sans can pair nicely with Playfair Display. Plex Serif can pair nicely with Space Grotesque.

img: an example showing example of Plex Serif, Mono, and Sans being used together
An example showing example of Plex Serif, Mono, and Sans being used together

Cautiously Avoid

Here is a tip instead: If you use bold versions of anything at a smaller size, you can increase the letter spacing slightly — it allows people to read better.

Creative Prompt

On my Instagram, I host a Tip Wednesday design challenge, where you gave a tip on a subject you know about on Wednesday and publish it as a post and a story. Can you make a Tip Wednesday post with Plex?


Phew, You Made it

You can find Plex in Canva and Figma. It is available to download on Google Fonts.

Tips about using IBM Plex
Tips about using IBM Plex

If you enjoyed the posts here, subscribe to get updates from Typogram's blog!