: How can I visually compare OSX fonts with my primary webfont choice to determine fallbacks without an OSX device? How can a freelance web designer who doesn't own a Mac visually identify and

@Angie364

Posted in: #Fonts #Osx #ResourceRecommendations #WebsiteDesign #Workflow

How can a freelance web designer who doesn't own a Mac visually identify and compare fonts similar to their primary webfont choice, that are present on most OSX devices?

I need to define a fallback font stack for a website for:


when webfonts fail to load/render
decrepit browsers on older Apple systems don't support webfonts
The font that sometimes appears before the webfont renders in some browsers

(I'd prefer for it to be as close to the webfont as possible to lessen the appearance of change when the webfont does render)




I've found a tool called CSS Font Stack which lists common Windows/Mac fonts and their availability, but it only renders the Windows fonts for me, and the default stacks aren't great, so it's almost as time-consuming as looking up a list and checking each individually, and I still don't have a way to see the Mac fonts rendered in paragraphs, headings, different font sizes etc.

There are also many exhaustive lists around that will take ages to peruse, find and compare fonts well. This is quite a simple part of a website design project, and shouldn't be given too much time, but it is a requirement of a well-rounded website design.

Is there a resource anywhere that I can use to quickly render Mac fonts reliably, or at least a decent list of screenshots of the available fonts on OSX sorted into type categories?

What can I do to find similar fallback fonts available on OSX, when I don't own a Mac?

Vote Up Vote Down

Login to post a comment!