Compare fonts for use on your website

Will the fonts that you chose for your website appear as you expect them to when viewed on someone else's computer? This is another one of those tiny things that can make a big difference when evaluating the accessibility of your website.

We put together a font comparison table on our accessibility page back when we first made this site. We wanted to show examples of readable and unreadable onscreen fonts to demonstrate the importance of font readability. Now we put the pages into their own blog post for easier sharing.

The first table of font readability comparisons is text-only. Note that fonts that aren't installed on your computer will be shown as the default font that you've set for your computer. For those of you who don't have all the fonts installed on your computer, the second table is a graphic version of the same table made from screen-capture images to show what the actual fonts look like if they were installed on your computer and how they will look on a user's computer who does have them installed.

Font readability comparisons as text-only

Note:  All fonts in the table are the same font-weight setting and proportional font-size (96%).

Font Readability Comparisons

Table contents

The first column shows clear onscreen fonts and the second column shows fonts that are hard to read onscreen.

Clear Onscreen Readable Fonts Hard to Read Onscreen Fonts
Montserrat
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Baskerville
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Open Sans
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Minion Pro
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
LeagueGothic
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Copperplate
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Helvetica
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Garamond
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Helvetica Neue
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Times
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Trebuchet MS
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Times New Roman
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Verdana
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
New York
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Comic Sans MS (good for dyslexic users)
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Monotype Corsiva
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Lucida Sans
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Book Antiqua / Palatino
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Lucida Grande
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Futura
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Chalkboard
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Impact
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Sans-Serif
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Serif
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Arial
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Bookman Old Style
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Univers
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Bodoni BT
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Georgia
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Century Schoolbook
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Andale Mono
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Monospace
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Tahoma (monospace font)
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Courier (monospace font)
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Monaco (monospace font)
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±
Courier New (monospace font)
The quick brown fox jumps over the lazy dog.
1234567890,
!@#$%&*()+-";:?/<>’ ®™©=^äéëïöüñ~±

Font Readability Comparisons in a Graphic of Font Screen Captures

Note:  All fonts in the table are the same font-weight setting and proportional font-size (96%).

Graphic for updated (Feb. 2016) font comparison table

More Information About Fonts and Font Sizes

For additional information, check out the following links:

If you have additional tips and tricks for good readable fonts on the web, share them in the comments.