Typey

Typey works by showing a font selector when hovering the mouse next to a text block.

Developers can change the font size and the font family, applying the changes to the page's text in real-time.

This way they can get a preview of how the text looks like with various settings applied, and when done, they can easily export the CSS and add it to their actual stylesheets.

But this is not really such an innovative process, since there are already lots of similar tools that do so.

The thing that Typey does best and the feature that you really need to use it for over some other similar projects is its support for actually loading a list of all the current font families from the Google Web Fonts repository.

While similar projects usually load just a list of selected Fonts from Google's service to keep page loading time down, Typey uses Google's API to fetch a list of all the fonts, add them to the font customization widget, and only loading the actual font only when selected by the user for a preview.

This way users get both a fast loading font customization widget and up to date access to all of Google's free Web fonts.

A Typey demo is included with the download package.

Requirements:

• JavaScript enabled on client side
• jQuery
• Google API key