Guides / Typeface vs font
Typeface vs font
The two words are interchangeable in conversation, and almost everyone understands. There is still a difference, and it comes from lead and ink.
A design and its versions
A typeface is the design: the shapes of the letters, their proportions, the feel of the whole alphabet. Garamond, Helvetica and Baskerville are typefaces. A font is one concrete version of it, such as Garamond Bold at 12 points.
Where the words come from
In metal printing, a font was a complete set of metal characters in a single size and style. Garamond Italic at 12 points was a different font from Garamond Italic at 14. The typeface was the design all those fonts shared.
In daily use
On a computer, a font is usually the file you install, such as Garamond Bold. A family is the collection of related files: regular, bold, italic and so on. People say "change the font to Arial" and mean the typeface, and nobody is confused.
What this site makes
Neither. A typeface generator like this one swaps ordinary letters for special characters that look like another design. You get styled text, not a typeface and not a font file. The next page explains the trick.
Questions
Is Arial a font or a typeface?
Arial is a typeface. A specific version, such as Arial Bold, is a font.
Can I use the words interchangeably?
In conversation, yes. With a designer or a printer, using them precisely sounds more careful.
What does font-family mean in CSS?
It names the typeface you want. The browser then picks the right weight and style from that family.