If you worked with UI design, you’ll be familair with color matching, consistent icons set and the use of good typography.
While I was working on a project recently and desiging its UI, I noticed that there could be a relationship between icons set and the font (typeface) of the app. I’ll show this relationship in the upcomming sections with random fonts and weights and then trying subjectively to select the fonts that best match the icons.

Random fonts

In the first trial, I’ve used random fonts with different weights, regardless of the its name and weight.

At first sight, you’ll cleary notice that fonts in rows 3, 4 and 5 are bizarre here. They differ because their font weights don’t match the line width of the icons. Row 1 is also doesn’t match similar like rows 6 and 2. But, i’ll keep it now.

So, note #1 is that we strive to match font weight to the icons set line width.

We’ll try to adjust font weights next.

Matching font weights

As you can see below, the fonts weights are better matched, and less bizzare from the previous trial. However, rows 1 and 3 still lack to match.

This is because the fonts doesn’t have the matching weight to select from (there is no light weight or the regular weight that matches good with the icons line width), and most importantly, they’re serif fonts. Most serif fonts have varying curvature width, which make them differ from the existing fixed line width icons.
For this reason , I’ll exclude them.

Try to avoid serif fonts as possible (unless there are no other choise to select from).

Row 5 is a hand-written font, and I’ll exlude it because I don’t use hand-written fonts for UI apps (unless you’re explicitly wants to use hand-written fonts in your app).
Row 4 is a monospaced font, that is used to display source code, for example. I’ll exlucde it too (and, again, unless you’re explicitly wants to use monospaced font in your UI design).

This leaves us to the final round.

Best matching

Below, are the best fonts that match the icons set. Both, icons and fonts, are consistent in line width. Row 1 font even has close curvitaures with the icons, which makes it the ideal and the preferred font for those icons.

And, following the same selection rules, I’ll use other similar fonts, sans-serifs, and have matching weights. As you can see below, most fonts (if not all) have very good matching with the icons, and you can barely exlucde one that don’t fit. If you compare them with the first random fonts and weights, you’ll know the purpose of this article.

Conslusions

Sans-serif fonts, with the same weight as the icons line width, will (mostly) have the match.
In the end, I hope you find this article helpful and assist you in selecting better fonts for you icons.