IBM Plex Serif and IBM Plex Sans Font Pairing

IBM Plex Serif and IBM Plex Sans are a matched pairing with an engineered, thoughtful character. The serif sets the headings at weight 600, and the sans carries the body. It feels precise but still human, which suits technology companies, technical blogs, developer documentation and research sites.

Why IBM Plex Serif and IBM Plex Sans Work Together

IBM Plex is the corporate type family for IBM and an open source project, designed by Mike Abbink at IBM with the Dutch foundry Bold Monday. It was made to capture the relationship between people and machines, a long-running theme for the company. The result is a neutral yet friendly grotesque sans, joined by a serif, a mono and condensed styles that all belong to one system.

Plex Serif is unusual because it does not feel like a bookish add-on. It has the same engineered details as the sans, so a serif heading looks technical and modern instead of traditional. Pairing the two gives a page more character than a single sans would, while keeping the same structured feel. It reads like a well-organized technical manual.

Where IBM Plex Serif and IBM Plex Sans Work Best

Technology companies and developer documentation are the obvious home for this pair. A software firm can use the serif for articles and announcements and the sans for product pages. Research labs and engineering blogs suit it too. Since the same family includes IBM Plex Mono, code samples can match the rest of the page, which is a real advantage on technical sites.

Weights and Sizes to Use

Set IBM Plex Serif at 600 for headings, or 500 for a lighter tone. Use IBM Plex Sans at 400 for body text and 600 for bold. Body text works well at 16 to 18px with a line height near 1.6, and headings should sit around 1.2. Both families come with italics, and the serif’s italic is worth using for subtitles.

Things to Watch

Plex has a distinct corporate feel, so it can seem cool on a personal or lifestyle site. Its details are also strongly associated with IBM, so large technology brands might want something less recognizable. Check that your CSS loads the right families, since Plex has many related styles, and avoid loading ones you are not using.