Selecting Typography Using OS X’ Preview

I set out to using free, open-source web fonts for a par­tic­u­lar project lately. I’ve had book­marked some arti­cles a while back with some pretty cool com­bi­na­tions that will help the Design process move a long a bit faster. To name a few:

In those arti­cles where screen­shots of sam­ple com­bi­na­tions. I just saved them to my local drive for com­par­i­son. If you don’t have Adobe Light­room (for its Sur­vey or Com­pare views) or Adobe Bridge (for its Thumb­nail view) but are on OS X, you can use Pre­view to com­pare the stills.

selecting-typography-01

I tried it for this cur­rent project. The only caveat is the amount of pieces you can fit on screen. In my case, work­ing on a 13″ Mac­book Pro, I was able to view 6 at a time.

selecting-typography-02

Within it, you have the option to exclude/trash combination(s) you are fil­ter­ing out of the project.

selecting-typography-03

Note that you can use Finder’s “Icon” view and increase the size of the win­dow & thumb­nails as well. The only thing with that is that if you have an appli­ca­tion like Drop­box (in my case) that con­trols the icon/thumbnail’s aestethics (e.g. green check­mark sym­bol), you’ll get the following:

selecting-typography-04

Some­what of a dis­trac­tion ain’t it? Although you can turn off Drop­box for a moment, I find using Pre­view more effi­cient than it.

A few more inspi­ra­tion can be had with these site’s typog­ra­phy sections:

You can then use site tools like Chip Cullen’s Font Com­bi­na­tor1 to cre­ate screen­shots of sam­ple combinations.

selecting-typography-05

I hope that helps you in your process, or adding a bit of a tweak to it depend­ing on what the project calls for. 

  1. Uses Google Web Fonts only. []

Leave a Comment

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>