Which fonts are installed on your computer?

Building the list of fonts on your computer... checks remaining. Found fonts so far: (you can cycle through the fonts by picking a font from the list, and then using your up/down keys)

In all seriousness though, this webpage is able to figure out which fonts are installed on your system by basically running through some 2500 known fonts., and checking whether or not applying that font to an on-page text string, made invisible by setting its CSS opacity to 0.0, changes its width.

Rather than guessing what its width should be based on the font name, which is an unreliable method for a reasonably high number of similar fonts, a very special font, "empty30.ttf", is loaded through an @font-face rule. This font has 30 quad-unit width numbers 0 through 9 and letters a-z and A-Z. A normal quad in a TTF font is 1024 units wide, so the test string "abcdefghijklmnopqrstuvwxyz0123456789" typeset using this special font takes up the same amount of horizontal space as a single letter in most normal fonts.

For each font in the font list, this page checks whether the CSS rule "font-family: testfontname, empty30" typesets the text with the test font, by checking the resulting width. If it's wider than what "empty30" is, then we know this font is installed on your computer, and it can be used by a webpage in the knowledge that you will see the correct typesetting.

Of course, 2500 fonts is a bit rich, and can easily take quite a few seconds to run, but reducing the list to 250 "popular" fonts makes this detection mechanism actually quite deployable.

You're free to use this on your page for non-commercial purposes. If you're a website that sells something, or acts as a sales broker, please contact me before using this code or this approach. I still have a student-loan to pay off, you can use this on your commercial site for a small license fee =)

Written and (c) 2011 Mike "Pomax" Kamermans of