Typography

A clear typographic hierarchy is critical to the effective communication of our brand. Type should be light and well-spaced to reinforce that we are transparent, open, and approachable. This system uses weight, scale, and capitalization to convey the relative importance of each heading within a document. Readability and accessibility allow all users to efficiently read and absorb textual information.

More information can be found at:

  • http://cfpb.github.io/design-manual/brand-guidelines/typography.html

Typefaces

Avenir Next is the primary brand typeface and can be used across all formats from print to digital. Its round and geometric letterforms are approachable and modern.

Avenir Next Demi Bold

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789

HTML code snippet

<h4 style="font-family:'AvenirNextLTW01-Medium';font-weight: 600;letter-spacing: 1px;">Avenir Next Demi Bold<br><br>
ABCDEFGHIJKLMNOPQRSTUVWXYZ<br>
abcdefghijklmnopqrstuvwxyz<br>
0123456789</p></h4>

Avenir Next Medium

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789

HTML code snippet

<h4 style="font-family:'AvenirNextLTW01-Medium';font-weight: 500;">Avenir Next Medium<br><br>
ABCDEFGHIJKLMNOPQRSTUVWXYZ<br>
abcdefghijklmnopqrstuvwxyz<br>
0123456789</p></h4>

Avenir Next Regular

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789

HTML code snippet

<h4 style="font-family:'AvenirNextLTW01-Regular';">Avenir Next Regular<br><br>
ABCDEFGHIJKLMNOPQRSTUVWXYZ<br>
abcdefghijklmnopqrstuvwxyz<br>
0123456789</p></h4>