[web_design] Quickly ID Web Page Fonts with WhatFont Bookmarklet

2596.There are quite a few ways of figuring out what font a web page is doing but Chengyin Liu may have just come up with the quickest, most intuitive.

Utilities like Firebug are nifty but they assault you with information … way too much unless you’re a real web-design pro. Or maybe you are but you want a real quick read. Here’s how you go about it.

1. Navigate to this page: http://chengyinliu.com/whatfont.html

2. Mouseover the gray button that reads WhatFont, click and drag to your bookmarks bar, and drop it. It will lodge there under with the label “WhatFont”.

Dragging WhatFont

Additionally, you can click on the button to try it out without installing it.

3. To use the bookmarklet, click on it and mouse over the text. You’ll see something just like this:

WhatFont In Action

The font (as defined in the page’s font specification) appears in a gray box just like above.

4. To turn it off, click on the “Exit WhatFont” block that has appeared in the upper-right-hand corner of the browser window:

Exit WhatFont

… and it will go away.

It’s just a clever, quick, and simple way to do it.



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: