Tools and Tutorials
< 5 minute read

Dissecting the Intricacies of Typography Anatomy (with Infographic)

Micah helps businesses craft meaningful engagement through branding, illustration, and design.

You’re a creative professional. You’ve been peering into a laptop all day, and while your eyes and mouse-fingers are fitter than ever, the rest of your body feels like a crumpled can of cola. So, you head to the local gym, shuffle over to the free-weights, and encounter a conversation between some muscle dudes:

MD1: Sup, bro. What’re you working today?

MD2: Delts, traps, and tris. You?

MD1: Dang, bro. It’s leg day. Quads and glutes.

MD2: Go get it!

To the uninitiated, this exchange might as well be uttered in an Elvish tongue, but for those with prior exposure to the world of bodybuilding, it’s understood that these brawny gentle-bros are discussing which parts of the physical anatomy they plan to sculpt.

In like fashion, designers have their own obscure nomenclature related to letter anatomy. Letter anatomy? Yes, the characters used to construct our written languages have anatomical features and classifications. In fact, letterform composition can be quite complex.

Still, some may wonder, “If letters have anatomy, is there any practical value that comes with knowing what all the little parts are called?”

There certainly is. Here are four examples that show how knowledge of letter anatomy is useful to professional designers:

1. Conversations with Clients

Most clients won’t have a clue what to call different letter parts. Instead, they’ll say things like, “That little arch connecting the ‘c’ and ‘t’ looks weird to me.” Because you’ve learned letter anatomy, you’ll know exactly what they’re referring to—Gadzook!

Type anatomy gadzook

Gadzooks come in a wide variety of styles, as evidenced by typefaces Geneva (left), Hoefler Text (middle), and Palatino (right).

2. Diagnosing Design Issues

Letterforms are responsible for all kinds of confounding design issues. Whether in logotypes, section headers, or navigation menus, sometimes letters just don’t look right. Knowing letter anatomy will allow you to quickly pinpoint the problem, understand why it exists, and find a solution. “That ‘e’ looks bad because the finial is too thick. Let’s add a bit more taper.”

3. Enhancing Legibility

Letter anatomy can actually hinder or improve legibility. For instance, fonts with ample counters (the negative space inside of letters like ‘p’ and ‘o’) and a tall x-height (the height of lowercase letters) are typically considered easier to read.

Typeface anatomy: parts of a letter affect legibility.

This example compares the legibility of Poplar Std Black (left) and Muli Regular (right). Thanks to large counters and ample x-height, Muli is much easier to read at a smaller size.

4. Letters are Everywhere

If you’re a designer, there’s no escape—letters dominate our physical and digital environments. With ample letter knowledge, you’ll have access to more solutions when attempting to solve a wide array of visual design problems.

Learning Lesser-Known Typography Anatomy

In actuality, there are a ton of letter anatomy terms, and unless you’re a type designer, you probably don’t need to learn them all. Some are obscure and rarely implemented in the letters we encounter on a regular basis (ball terminal, diacritics, gadzook, etc.), and others are almost universally recognized (x-height, ascender, descender, etc.).

With that in mind, we present a collection of commonly used—yet lesser known—letter parts that every designer should be aware of.

Infographic showing typography anatomy and the anatomy of a letter

• • •

Further reading on the Toptal Design Blog:

Understanding the basics

What is the white space inside letters like O and P called in UI?

The white space (or negative space) inside letters like ‘o’ and ‘p’ is called a counter. Counters are an important part of typography anatomy because they affect legibility. In general, type styles with larger counters are easier to read, especially at small sizes.

What are the parts of a font?

When it comes to naming all the little parts that make up letters, the list gets long in a hurry. Some common parts that designers might need to know are x-height (the height of lowercase letters) and ascender (the upward stem on letters like ‘b’ and ‘k’).

What is the anatomy of typography?

Similar to the human body, letters are composed of parts that give them structure, and as the human body, these parts are labeled anatomy. There are many letter parts to be learned when studying typography. For instance, did you know that the horizontal stroke on a capital ‘G’ is called a chin?

Why is typography important in design?

Typography is the practice of arranging words so that they are both easy to read and visually pleasing. This is important in design for a number of reasons. For example, designers of digital products need to make sure that the text users encounter is accessible, legible, and visually engaging.

What is the difference between a typeface and a font?

There’s overlap between the two terms, but here’s a helpful distinction: A typeface is a named set of designed glyphs (letters, numbers, etc) that can exist anywhere type can exist (in a computer, painted on a wall, carved in stone, etc). A font is a digital file that generates text in the form of a typeface.