David King

full stack developer

All Blog Articles

Prev « Mike Monteiro says 'F*ck You. Pay Me' Next » Desktop error notifications - FOR NERDS


How to test many fonts on your site?

22 Jul 2011

I've been pondering today about how the quickest and easiest way to test-drive different fonts, like hundreds of them, on a website... tinkering with the fontsquirrel and google fonts libraries I found myself speccing up a browser plugin / extension based around this piece of code:

$('head').append('<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Lobster+Two&v1&v1" />');
$('body').css('font-family', "'Lobster Two', arial, serif");

...as you can see, if you dumped this into into the console on a site with jQuery it will switch out the font assigned to the body allowing it to cascade down through the DOM.

Which leaves me with the question; would it be productive to write a chrome extension where you can select any of the freely available hotlinkable fronts and apply it to a website? I think it would! Weekend project here we go :-)

Beer first.


Prev « Mike Monteiro says 'F*ck You. Pay Me' Next » Desktop error notifications - FOR NERDS