We built FontForThat: find free font alternatives and try them with your own text

A mockup uses a font you like, but you need a free alternative for the actual site. A list of similar fonts gets you started. You still need to see what happens to your headline, your buttons, and the words you intend to ship.

We built FontForThat for designers and developers making that choice. You can look up a familiar font or start with what you're designing, then compare candidates with your own text. FontForThat

What you can do

• Find a free replacement. Look up a font such as Verdana and compare measured alternatives, including differences in letter shapes and width.
• Start with a project. Browse suggestions for tasks such as logos, where you may care more about the character of the lettering than resemblance to an existing font.
• Try your actual copy. Type a brand name, headline, or interface label into an editable specimen and see how each candidate handles it.
• Check the licence. Look up the recorded terms and source for the font before you choose it for a website, app, or logo.

What changes in a 167 px slot

The Verdana comparison in FontForThat reports an average letter-width difference of about +0.3% for DejaVu Sans. It also flags I, J, and j among the glyphs with the largest differences. Verdana comparison and glyph measurements

Here are two strings measured at 16 px with Pillow, using regular Verdana from Windows and regular DejaVu Sans 2.37. DejaVu Sans release

Text	Verdana	DejaVu Sans
I will join in a minute	172 px	163 px
View your invoice	141 px	140 px

At this measured size, the first string fits in a 167 px slot with DejaVu Sans. It exceeds the slot by 5 px with Verdana. The second string fits either way.

Reproduce the measurement

Install Pillow and point the script at the two regular font files on your machine. getlength gives the advance of the string, the distance the text occupies along the line.

from PIL import ImageFont

samples = ["I will join in a minute", "View your invoice"]
slot = 167

for path in ["verdana.ttf", "DejaVuSans.ttf"]:
    font = ImageFont.truetype(path, size=16)
    for text in samples:
        width = font.getlength(text)
        print(path, repr(text), f"{width:.2f}px", width <= slot)

For a web app, take the labels closest to their width limits and check them in the browser with the real font files, weight, spacing, and container styles. Include your longest translations. Different font builds and shaping settings can change the numbers, and the browser controls the actual wrapping.