Typography
10 open-source fonts, tested side-by-side for body text readability. Adjust size and compare rendering across sans-serif and serif families.
The quick brown fox jumps over the lazy dog.
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line spacing, letter spacing, and adjusting the space between pairs of letters. Good typography establishes a strong visual hierarchy, provides a graphic balance to the website, and sets the product's overall tone.
Optimized for screens. Tall x-height, open apertures.
The quick brown fox jumps over the lazy dog.
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line spacing, letter spacing, and adjusting the space between pairs of letters. Good typography establishes a strong visual hierarchy, provides a graphic balance to the website, and sets the product's overall tone.
Adobe's open-source serif. Crisp, elegant, highly readable.
The quick brown fox jumps over the lazy dog.
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line spacing, letter spacing, and adjusting the space between pairs of letters. Good typography establishes a strong visual hierarchy, provides a graphic balance to the website, and sets the product's overall tone.
Warm, traditional serif with large x-height. Great on screens.
The quick brown fox jumps over the lazy dog.
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line spacing, letter spacing, and adjusting the space between pairs of letters. Good typography establishes a strong visual hierarchy, provides a graphic balance to the website, and sets the product's overall tone.
Google's universal sans. Harmonized across all scripts.
The quick brown fox jumps over the lazy dog.
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line spacing, letter spacing, and adjusting the space between pairs of letters. Good typography establishes a strong visual hierarchy, provides a graphic balance to the website, and sets the product's overall tone.
Grotesque with personality. IBM's corporate typeface.
The quick brown fox jumps over the lazy dog.
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line spacing, letter spacing, and adjusting the space between pairs of letters. Good typography establishes a strong visual hierarchy, provides a graphic balance to the website, and sets the product's overall tone.
Well-balanced contemporary serif. Brush-derived curves.
The quick brown fox jumps over the lazy dog.
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line spacing, letter spacing, and adjusting the space between pairs of letters. Good typography establishes a strong visual hierarchy, provides a graphic balance to the website, and sets the product's overall tone.
Grotesk-inspired. Clean, neutral, highly legible.
The quick brown fox jumps over the lazy dog.
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line spacing, letter spacing, and adjusting the space between pairs of letters. Good typography establishes a strong visual hierarchy, provides a graphic balance to the website, and sets the product's overall tone.
Classic Baskerville for the web. Refined and authoritative.
The quick brown fox jumps over the lazy dog.
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line spacing, letter spacing, and adjusting the space between pairs of letters. Good typography establishes a strong visual hierarchy, provides a graphic balance to the website, and sets the product's overall tone.
Designed for low-vision readers. Maximum distinction.
The quick brown fox jumps over the lazy dog.
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line spacing, letter spacing, and adjusting the space between pairs of letters. Good typography establishes a strong visual hierarchy, provides a graphic balance to the website, and sets the product's overall tone.
Google's first original serif. Productive, versatile.