Typeface vs. Font: What’s the Difference?

In the design world, there’s a lot of talk about typefaces and fonts. But what’s the difference? And why do they matter? As it turns out, this distinction is pretty important.

As a graphic designer, you know that typefaces and fonts can greatly impact your final product. So if you’re not sure what the difference is, or you want to learn more about the difference between typeface vs. font, read on!

What is a Typeface?

What we usually refer to as a font is actually a typeface. (Don’t feel ashamed, we all do it — even here on this site — that’s how common it is!) A typeface is a set of letters, numbers, and symbols that share a common design.

When you see a typeface, you can usually tell that all the characters come from the same family and share common design characteristics.

For example, Times New Roman is a serif typeface — all the letters look similar, with small serifs (the little feet on the letters).

Helvetica is another typeface — a sans serif. The letters are more blocky and have no serifs.

Mistral is a popular script typeface, and so on.

If you’ve ever scrolled for hours searching for the perfect typeface for your design project, you’re well aware of the abundance of typefaces available!

What is a Font?

A font, on the other hand, is a specific size, weight, width, and style of a typeface. For example, Times New Roman can come in many different fonts — you’ve surely seen it italicized or in all caps. Helvetica can also come in different fonts — maybe you’ve seen it in 12-point size or bold.

Typeface vs. Font

So, basically, a typeface is the design of the letters, and a font is how that design is used or the style of the typeface.

In simple terms, “typeface” is the broader term. It encompasses all styles of the design. “Font” describes the many ways a typeface can vary in its design. Here are some examples:

• Size: Ready to have your mind blown? Different sizes of the same typeface are technically two different fonts. You read that correctly. Helvetica 12-point and Helvetica 10-point are two different fonts, even though they otherwise look exactly the same. This goes back to the old pre-digital days when a different size of type would have needed an entirely different set of printing blocks.
• Weight: Bold type is a font. Extra Light type is a font. Helvetica Heavy and Helvetica Medium are two distinct fonts. You get the idea.
• Width: Condensed, Extra Wide, Narrow, etc. Each unique style is a different font.
• Italic: You guessed it — Italic type is also a font.

The History of the Terms

Now that you know the difference between typeface and font, let’s talk a little bit about the history of each term. 

The word “font” comes from the French word “fonte,” which means “to melt.” In the days of movable type, the type was cast from metal molds.

Fonts that shared a common design were called a typeface. The typeface would be carved into a woodblock, which would be used to make a mold. The mold would then be filled with molten lead, and when it cooled, the lead would solidify into type. So the word font literally refers to the process of melting typefaces into a mold.

Digital type design has certainly made this process a lot easier, but the terminology has stuck around.

We have Microsoft to thank for the word “font” being used more often than the (more accurate) word typeface. In the earliest versions of their Word software, they labeled the list of typefaces as “fonts,” and the rest is history.

How the Terms are Used

Despite their technical definitions, in the world of digital design, typefaces and fonts are pretty much used interchangeably.

When working in a word processor, like Microsoft Word, or a graphic design program like Adobe Photoshop or Adobe Illustrator, you’ll see both terms used to refer to the different styles of type. In the world of web design, typefaces and fonts can also be used interchangeably.

However, there’s a distinction between the two terms when it comes to CSS. In CSS, typefaces are defined using the font-family property, while fonts are defined using the font property.

Typefaces vs. Fonts: Which Should I Use?

Now that you know the difference between typefaces and fonts, you might wonder which one to use. The answer is both!

When you’re talking about the different styles of type, feel free to use either term. However, if you want to be more specific, the term typeface can refer to the unique design of the letters, while font can refer to the typeface’s size, weight, and style.

Typeface vs. Font: Final Thoughts

So now you know the answer to the typeface vs. font debate — they’re both right!

Now go forth and impress your friends with your vast knowledge of type terminology!

And don’t forget, when in doubt, you’ll be absolutely fine if you use the word “font.” It’s more important, as a designer, that you focus on finding typefaces (and fonts) that complement each other rather than getting hung up on the terminology.