“The simplest scale is a single note, and sticking with a single note draws more attention to other parameters, such as rhythm and inflection… In the sixteenth century, a series of common sizes developed among European typographers, and the series survived with little change and few additions for 400 years… This is the typographic equivalent of the diatonic scale.”
—Robert Bringhurst, The Elements of Typographic Style
Font sizes
| A |
A |
A |
A |
A |
A |
A |
A |
| 6rem (96px) |
5rem (80px) |
3rem (48px) |
2.25rem (36px) |
1.5rem (24px) |
1.25rem (20px) |
1rem (16px) |
.875rem (14px) |
Examples
<h1 class="f-headline lh-solid">Title</h1>
A modular scale, like a musical scale, is a prearranged set of harmonious proportions.
<h1 class="f-subheadline lh-title">Title</h1>
A modular scale, like a musical scale, is a prearranged set of harmonious proportions.
<h1 class="f1 lh-title">Title</h1>
A modular scale, like a musical scale, is a prearranged set of harmonious proportions.
<h1 class="f2 lh-copy">Title</h1>
A modular scale, like a musical scale, is a prearranged set of harmonious proportions.
<h1 class="f3 lh-copy">Title</h1>
A modular scale, like a musical scale, is a prearranged set of harmonious proportions.
<h1 class="f4 lh-copy">Title</h1>
A modular scale, like a musical scale, is a prearranged set of harmonious proportions.
<h1 class="f5 lh-copy">Title</h1>
A modular scale, like a musical scale, is a prearranged set of harmonious proportions.
<h1 class="f6 lh-copy">Title</h1>
A modular scale, like a musical scale, is a prearranged set of harmonious proportions.