Categories / Tutorials
The Designer’s Guide to Font Formats: TTF, OTF, WOFF, EOT & SVG
EOT, TTF, WOFF, SVG, WOFF2... there are so many choices! Let's brush up on some basics and take a closer look at the different font formats in use on the Web.
Creative Market
Last updated: March 27, 2025 · 9 min read
Font Formats by Browser Support
Selecting the right font format is often a confusing endeavor. With no less than five major formats still in circulation, it’s not as easy as selecting a font and firing up Figma or Photoshop.
TrueType Font (TTF)

OpenType (OTF)

Web Open Font Format (WOFF)

Embedded Open Type (EOT)

Scalable Vector Graphics font (SVG)

Choosing the Right Font Format for the Job
When it comes to selecting the right font format for your project, there are a few things to consider, the first of which is the final deliverables of your design project. Since different formats work better on different platforms, you’ll need to ensure the font you pick is compatible with – and optimized – for the platform your work ends up on.ÂPrint Design Projects
If you’re a graphic designer working on projects that will end up in print, the formats available to you are narrower. Most desktop applications, including the Adobe suite and other popular design tools, only support TrueType and OpenType font formats. While these tools can open SVG fonts, these fonts won’t provide the same level of typographical control as the fonts supported on your system. The SVG format is a good choice if you need a highly detailed font for a logo. Many typeface designs, designed as lettering sets, only come in SVG format. This type of typography considered a display font, is designed for short snippets of text. While they don’t have the same typographical considerations for use in body or document text, they’re often far more detailed than a typical font.- Best font formats: TTF and OTF
- Less optimal formats: SVG
- Formats to avoid: N/A
- Incompatible formats: WOFF and EOT
App and Interface Design Projects
Nearly any product designer will tell you that selecting the right font for a digital product is integral to its success. Interface designs, in particular, often have higher legibility requirements than a document or website. Since users potentially read the same text over and over, interfaces require crystal-clear typography. Given the widespread availability of apps across desktops, mobile devices, and the web, the right font format isn’t always clear. While TrueType and OpenType fonts remain the best and most accessible options if you’re designing apps for the web, the best option changes to WOFF.- Best font formats: TTF, OTF, and WOFF
- Less optimal formats: N/A
- Formats to avoid: SVG
- Incompatible formats: EOT
Web-Based Design Projects
When it comes to design, no other medium has the variability and technical considerations that the web does. With an expansive range of operating systems, web browsers, internet connections, and screen sizes, choosing the right font format is as difficult as finding good freelance design jobs. In other words, it’s difficult if you don’t have a good resource. While you don’t need to be a web developer, you do need some technical prowess if you’re designing for the web. For starters, knowing what kind of browsers your audiences use impacts what font format you’ll choose and use during the design process. For modern browsers, WOFF offers the best performance and availability. Older browsers that lack support, on the other hand, may require you to embed an OTF or TTF font. Some designs might require both approaches. Not quite antiquated and not quite modern, the SVG font format is better left to design-only applications. While some older browsers still support it, most modern implementations have dropped support in favor of WOFF. In the increasingly rare event that you’re designing a site for users on Internet Explorer, you might use an EOT font. But in cases like these, it’s better to go with a system font for performance reasons.- Best font formats: WOFF
- Less optimal formats: TTF and OTF
- Formats to avoid: SVG
- Incompatible formats: EOT
Design Projects With Wider Impact
If you’re looking for a way to raise your value and increase your design salary, take some time to understand how typefaces and font choices impact the breadth of design. With the increasing popularity of design systems and business presence across a range of digital and physical mediums, choosing the right font format shouldn’t be an afterthought. Right now, for wide-ranging compatibility and safety, TTF or OTF is the best choice. But that certainly won’t be the case in every situation, and as you can see from the evolution of fonts over the years, it certainly won’t be that way in the future.Selecting the Right Font Format: Sans Confusion
The sheer number of available formats and how they’re used can make selecting the right font overwhelming. Taking the time to read guides like this one or finding a design mentor to help augment your knowledge goes a long way. Ultimately, knowing where and how to use each format makes you a much more well-rounded designer.Products Seen In This Post:

Getting started with hand lettering?
Free lettering worksheets
Download these worksheets and start practicing with simple instructions and tracing exercises.
Download now!About the Author

Creative Market
Making beautiful design simple & accessible to all.
View More Posts
5 Comments