10 Best Fonts For UX Design (2022) – Favourites of Our UX Consultants

Whether in print or digital, font has always played an important role. It can change a design completely. Therefore beginners in UX might wonder: What fonts should I use? Am I using the right fonts? In this article, we are clearing the doubts by listing 10 fonts that our UX consultants love to use. 

The fonts in favour are:

• Roboto
• SF Pro
• Inter
• Proxima Nova
• Helvetica Neue
• Manrope
• Open Sans
• Avenir
• Circular Std
• Palatino

Best Fonts Recommended by UX Consultants 2022

Roboto – The Go-To Font

Roboto is the font that receives the most votes from our UX consultants. It’s described as smooth, simple and easy-to-read, which are fundamental in UX design. Certainly, we don’t want a font that would distract reviewers’ attention when they go through the wireframes. Besides, it is free for personal and commercial use. Google developed this sans-serif typeface and uses it as the system font on Android and many other Google products including Google Maps and YouTube. You can rest assured that Roboto is a common, recognisable font that guarantees readability thanks to its smooth strokes and nice kerning. 

“It’s got different weights, thin to black. And it’s very easy to read. So simple and so smooth.” – Mae, UX Consultant
“It’s a google font so it’s free. It’s common, recognisable and easy to read.” – Emilia, UX Consultant
“You get many options of weights. It’s just clean and simple.” – Ali, UX Consultant

6 weights: Thin, Light, Regular, Medium, Bold, Black
Where to find: https://fonts.google.com/specimen/Roboto

SF Pro – Apple First Choice

Created by Apple, SF Pro is the default font for iOS and all the other operating systems of Apple. It comes with a wide range of weights and widths, making it highly flexible for different design needs, not to mention that SF Pro supports over 150 languages. As a sans-serif typeface, meaning there is no extra stroke at the end of main strokes, SF Pro is clean and simple. It can be your first choice if you are designing for an iOS app or software.

“It’s the Apple font and therefore great for iOS products.” – Emilia, UX Consultant

9 weights: Ultralight, Thin, Light, Regular, Medium, Semibold, Bold, Heavy, Black
4 widths: Compressed, Condensed, Regular, Expanded
Where to find: https://developer.apple.com/fonts/

Inter – Ideal for Desktop

Inter is a free typeface designed by Google specifically for computer screens. If you are looking for a font for wireframes of desktop websites, Inter is an ideal candidate. Bearing a tall x-height, Inter is easy to use and read as tall-x-height fonts look larger when set at the same size as short-x-height fonts. What’s more, certain OpenType features such as tabular numbers and slashed zero are supported.

 

“It’s a relaxing font. Very easy to read and use for wireframes.” – Ali, UX Consultant

9 weights: Thin, Extra Light, Light, Regular, Medium, Semi Bold, Bold, Extra Bold, Black
Where to find: https://fonts.google.com/specimen/Inter#standard-styles

Proxima Nova

Proxima Nova is a very popular choice when it comes to website design. Although it is not free (prices vary from £13 to £24 per style by different retailers), the font is covered by Adobe Fonts library so people with access to Adobe services like Photoshop are able to use it commercially in the forms of pdf, web project, video, et cetera. The typeface is modern and clean, available in various weights and widths. OpenType features including small caps and alternate characters are also provided.

“The font is clean. And you can get the exact style you need, no matter how thin or bold.” – Jesper, UX Consultant

8 weights: Thin, Light, Regular, Medium, Semibold, Bold, Extrabold, Black
3 Widths: Extra Condensed, Condensed, Normal
Where to find: https://www.marksimonson.com/fonts/view/proxima-nova

Helvetica Neue

Before SF Pro, Helvetica Neue was the typeface that Apple adopted in iOS and macOS. Being a sans-serif font, Helvetica Neue is famous for its neutrality and simplicity. Thus it is perfect for wireframes. The font will not cause distraction or steal the spotlight from others. Readers can focus on the pieces that you want to put emphasis on. Helvetica Neue may not be the most stylish font but it is effective and does the job.

8 weights: UltraLight, Thin, Light, Roman, Medium, Bold, Heavy, Black
3 widths: Condensed, Normal, Extended
Where to find: https://www.linotype.com/1266/neue-helvetica-family.html

Manrope

Designed in 2018, Manrope is a fairly new typeface. It finds the middle ground between font characteristics such as rounding, geometry, and width. Its usability is strengthened by several features. For example, digits in Manrope come in both proportional and tabular⁠, and the glyphs change automatically according to the context. This modern font is now one of the Google fonts. It can be used for free commercially.

7 weights: ExtraLight, Light, Regular, Medium. SemiBold, Bold, ExtraBold
Where to find: https://fonts.google.com/specimen/Manrope

Open Sans

Open sans is a humanist sans-serif font with a vertical stress, which means the font has an upright posture, as if there is stress coming from two sides to the vertical axis. Like other Google fonts, Open Sans is allowed for commercial use for free. This neutral typeface is compatible with small mobile interfaces. It is not a surprise that Google uses this font on many of its web pages. At the same time, Open Sans has been one of the most popular Google fonts.

6 weights: Light, Regular, Medium. SemiBold, Bold, ExtraBold
2 widths: Condensed, Normal
Where to find: https://fonts.google.com/specimen/Open+Sans#standard-styles

Avenir

Born in the late 1980s, Avenir is a sans-serif font that is not completely geometric – the upper parts of the letters are shorter, and some strokes are thicker than others. Having human nature in mind when creating this typeface, the designer added those characteristics to increase legibility, which makes Avenir a great option for UX design.

6 weights: Light, Book, Roman, Medium, Heavy, Black
Where to find: https://www.linotype.com/72/avenir-family.html