Everything else is less user friendly. This loads instantly, looks perfect on the user's screen, and is guaranteed to look exactly as it's supposed to.
By using a font like Inter UI you create the same experience for everybody, regardless of the platform.
Segoe UI, Ubuntu, Cantarell (Windows, Ubuntu, Gnome/Fedora) are within a different typographic category than San Francisco or Roboto, they're not even similar enough to each other. By using the system font stack you're basically fragmenting the user experience and look and feel.
Inter is a substitute for well crafted neo grotesque fonts loved by designers, like San Francisco (which itself is a better fitting alternative to Helvetica), it's of a similar quality.
For anyone like me who might think that this is a pretty looking typeface but not particularly fully featured, scroll down the page to this bit: https://rsms.me/inter/#features
This is an amazingly well featured typeface where the author clearly has considered a number of use cases, particularly in terms of legibility at small sizes which is important for UI. This looks great! File size may be an issue for public web UIs, as someone mentioned, but there are so many more places this could be used to great effect. Will definitely consider for future projects!
FYI: it's a bit easier to spot the variations if you highlight both the Disabled and Enabled examples in a line. The light-green blocks by themselves definitely make it harder for me to make out the details, but once highlighted the improvements are much more obvious.
I really like the typeface, so I hope this comment won't come off as too negative. In the FAQ the author mentions that you can fetch the typeface directly from his site. I'd advise against relying on third-parties without contractual obligations to you in production.
If you decide to take this risk anyway then you should take steps to reduce the risk of future security issues. The most important thing is to use use Subresource Integrity [0] on your <link> tags. However, since the author doesn't provide versioned URLs (the query strings are only being used to bust the cache, not to select which file is served), this would likely cause your site to break on each release. Usually CDNs give you a URL which includes the version as part of the path.
Another issue is that SRI only checks top level resources, there's no equivalent for external fonts and images which get included from the stylesheet [1]. It doesn't seem like the largest attack vector, but you never know what kinds of browser bugs might pop up.
Finally, Cache-Control has a max-age of 4 hours. If you don't expect these resource to change then you'd want the value to be way longer.
Looks good! I haven't seen many variable fonts around yet. The samples include mock notebooks and poster layouts, but I'd love to see examples of it being used in an actual interface. (Outside of the site, which uses it.)
Also—not mentioned too prominently on the site—but it's open source as well! Awesome work. https://github.com/rsms/inter
TeX can use other fonts, but the default set of fonts used in TeX are "variable fonts". The term Knuth used was "metafonts", which is why the font-rasterizing program he wrote for TeX is called METAFONT. So you've probably read a number of books and many papers typeset in "variable fonts", as well as most of the math formulas on Wikipedia and in Jupyter.
Despite all the talk about being optimized for screen rendering, it sure looks lot blurrier and less even on my system than for example the classic Verdana, or the more modern Segoe UI
On my Linux and Firefox, font looks unpleasantly blurred in small sizes on their page. Maybe our hinting settings are different than theirs but that should not be a problem in a quality font.
The page mentions they have both hinted and unhinted files you can use... but they recommend only using them for Windows where users prefer that look. (You clearly do.) I'm guessing you're using the unhinted one?
Since this font contains the feature, let me mention one of my pet peeves in the hopes of raising awarenes: whatever you do, do NOT blanket enable the Discretionary Ligatures (dlig) feature across all of your header/body text. Use it sparingly, pinpointed to where you know in advance there are specific glyphs in the text that need to look different.
Enabling it all across your text with no regard on what text there will be will result in all kinds of unintended ligatures making the text appear bizarre, ugly and unprofessional, especially if there is any chance your text will be localized into non-latin languages.
I think if anybody is interested in using this as a webfont, you should take a look at the file sizes of the typeface. They're about 100-200kb each, which adds up if you're using multiple font weights. It could be significant depending on the context of your app.
Apparently this is because the font has a lot of glyphs that may not exist in other optimized web fonts (relevant GitHub issue: https://github.com/rsms/inter/issues/53).
As mentioned in that issue and the linked one, subsetting makes a huge difference, and can be done yourself. As not mentioned there, you can even split the subsets by Unicode range and let browsers handle which chunks to download. Browser support is even pretty good.[0]
This font (under default metrics settings) reminds me of Apple’s San Francisco. Is it similar, or are my eyes just deceiving me? (I’d check myself, but I’m on my phone at the moment.)
It's a very similar style with very similar objectives, so it's not entirely coincidence. It's also very similar to Google's Roboto for the same reasons.
That capital U is kind of horrible though. No compensation at large size for what the human eye perceives as a line-curve discontinuity on the inside of the glyph?
I like this much better than the typical Linux UI fonts, too. It looks cleaner and more visually pleasing. Would certainly enjoy using a desktop with this.
I had to choose a font recently, working with the client there were a few things such as 'no I don't want the eyeglasses g' and 'no I don't want descenders on numbers' and that was how we arrived at using 'Ubuntu' to fall back to the native font stack. This I was pleased with as Ubuntu is a system font on Ubuntu so working on a website where there is no need to download a 'Google Font' helps immensely when the cache is off.
However, I didn't like the 'M' and 'W' in Ubuntu, so I think I will be suggesting that we revise the font to this neat Inter UI font, loaded with 'defer' and the system fallbacks including Ubuntu.
This font is a very neat piece of work. It satisfies the 'g' and numbers requirements and is sans-serif. I can't wait to get working with it.
By opening the font file using FontDrop (https://fontdrop.info), you can see that it supports 39 languages:
Afrikaans Albanian Azerbaijani Belarusian Bosnian Bulgarian Catalan Croatian Czech Danish Dutch English Estonian Finnish French German Hungarian Icelandic Italian Latvian Lithuanian Macedonian Maltese Norwegian Ossetic Polish Portugese Romanian Russian Serbian Slovak Slovenian Spanisch Swedish Turkish Ukrainian Uzbek Vietnamese Zulu
Looks pretty but I wish the website showed it as a webfont instead of just a picture, so I can see how it will really look on my system (the differences in hinting can be substantial)
Yes, they are easier to design, and easier to parameterize, which is nice for you, the designer. But they are not nice for me, the reader. Using a sans font says to me that your comfort is more important than mine, and that your time is worth more than mine and everyone else's, combined.
In Firefox, I have disabled web fonts, and use Libertine everywhere. That choice is denied to me in Firefox on my phone.
[+] [-] lwansbrough|7 years ago|reply
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
Everything else is less user friendly. This loads instantly, looks perfect on the user's screen, and is guaranteed to look exactly as it's supposed to.
[+] [-] deltron3030|7 years ago|reply
Not really.
By using a font like Inter UI you create the same experience for everybody, regardless of the platform.
Segoe UI, Ubuntu, Cantarell (Windows, Ubuntu, Gnome/Fedora) are within a different typographic category than San Francisco or Roboto, they're not even similar enough to each other. By using the system font stack you're basically fragmenting the user experience and look and feel.
Inter is a substitute for well crafted neo grotesque fonts loved by designers, like San Francisco (which itself is a better fitting alternative to Helvetica), it's of a similar quality.
[+] [-] kitsunesoba|7 years ago|reply
As an aside, we will soon be able to use system-ui in place of a manually constructed font stack: https://caniuse.com/#feat=font-family-system-ui
[+] [-] sbr464|7 years ago|reply
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif
[+] [-] saagarjha|7 years ago|reply
[+] [-] dochtman|7 years ago|reply
https://bugzilla.mozilla.org/show_bug.cgi?id=1226042
[+] [-] hawski|7 years ago|reply
[+] [-] tqkxzugoaupvwqr|7 years ago|reply
[+] [-] rf15|7 years ago|reply
As I see it, this is very centric to a specific system and therefore does not offer the best user experience for everyone.
[+] [-] mstade|7 years ago|reply
This is an amazingly well featured typeface where the author clearly has considered a number of use cases, particularly in terms of legibility at small sizes which is important for UI. This looks great! File size may be an issue for public web UIs, as someone mentioned, but there are so many more places this could be used to great effect. Will definitely consider for future projects!
[+] [-] GordonS|7 years ago|reply
[+] [-] TheAceOfHearts|7 years ago|reply
[+] [-] qwerty456127|7 years ago|reply
[+] [-] Semaphor|7 years ago|reply
[+] [-] PostThisTooFast|7 years ago|reply
[deleted]
[+] [-] TheAceOfHearts|7 years ago|reply
If you decide to take this risk anyway then you should take steps to reduce the risk of future security issues. The most important thing is to use use Subresource Integrity [0] on your <link> tags. However, since the author doesn't provide versioned URLs (the query strings are only being used to bust the cache, not to select which file is served), this would likely cause your site to break on each release. Usually CDNs give you a URL which includes the version as part of the path.
Another issue is that SRI only checks top level resources, there's no equivalent for external fonts and images which get included from the stylesheet [1]. It doesn't seem like the largest attack vector, but you never know what kinds of browser bugs might pop up.
Finally, Cache-Control has a max-age of 4 hours. If you don't expect these resource to change then you'd want the value to be way longer.
[0] https://developer.mozilla.org/en-US/docs/Web/Security/Subres...
[1] https://github.com/w3c/webappsec-subresource-integrity/issue...
[+] [-] ryanwhitney|7 years ago|reply
Also—not mentioned too prominently on the site—but it's open source as well! Awesome work. https://github.com/rsms/inter
[+] [-] kragen|7 years ago|reply
[+] [-] zokier|7 years ago|reply
Here is quick and dirty comparison shot:
https://cdn.pbrd.co/images/HU2mq37.png?o=1
[+] [-] a-nikolaev|7 years ago|reply
Kerning in digits looks off in their example: https://i.imgur.com/AURrPtn.png (this is an example where fixed-width is disabled), don't know how pervasive this odd kerning is, or if this is bad only in the browser. Another example of bad kerning: https://i.imgur.com/PIYJgIz.png One more example: https://i.imgur.com/bOM4MZB.png
[+] [-] crazygringo|7 years ago|reply
The page mentions they have both hinted and unhinted files you can use... but they recommend only using them for Windows where users prefer that look. (You clearly do.) I'm guessing you're using the unhinted one?
[+] [-] johnday|7 years ago|reply
[+] [-] _fbpt|7 years ago|reply
[+] [-] needle0|7 years ago|reply
[+] [-] em-bee|7 years ago|reply
[+] [-] andrewthebold|7 years ago|reply
Apparently this is because the font has a lot of glyphs that may not exist in other optimized web fonts (relevant GitHub issue: https://github.com/rsms/inter/issues/53).
[+] [-] cpmsmith|7 years ago|reply
https://caniuse.com/#feat=font-unicode-range
[+] [-] derefr|7 years ago|reply
[+] [-] cpmsmith|7 years ago|reply
[+] [-] fredsted|7 years ago|reply
[+] [-] zepto|7 years ago|reply
[+] [-] TheRealPomax|7 years ago|reply
[+] [-] classichasclass|7 years ago|reply
[+] [-] andai|7 years ago|reply
[+] [-] Theodores|7 years ago|reply
However, I didn't like the 'M' and 'W' in Ubuntu, so I think I will be suggesting that we revise the font to this neat Inter UI font, loaded with 'defer' and the system fallbacks including Ubuntu.
This font is a very neat piece of work. It satisfies the 'g' and numbers requirements and is sans-serif. I can't wait to get working with it.
[+] [-] romanr|7 years ago|reply
Looks like apart from standard Helvetica/Apple/Microsoft fonts there’s a very small choice of fonts you can use if you have multi lingual UI.
It’s like creating a Latin font is relatively easy, but very few of them go all the way to full Unicode support.
[+] [-] alwillis|7 years ago|reply
Afrikaans Albanian Azerbaijani Belarusian Bosnian Bulgarian Catalan Croatian Czech Danish Dutch English Estonian Finnish French German Hungarian Icelandic Italian Latvian Lithuanian Macedonian Maltese Norwegian Ossetic Polish Portugese Romanian Russian Serbian Slovak Slovenian Spanisch Swedish Turkish Ukrainian Uzbek Vietnamese Zulu
[+] [-] m0zg|7 years ago|reply
[+] [-] bayindirh|7 years ago|reply
[+] [-] zaroth|7 years ago|reply
I’m getting “A problem repeatedly occurred while trying to load...” after it crashes and tries to reload several times.
I think the first time I’ve ever seen that actually.
[+] [-] Kuraj|7 years ago|reply
[+] [-] ncmncm|7 years ago|reply
Yes, they are easier to design, and easier to parameterize, which is nice for you, the designer. But they are not nice for me, the reader. Using a sans font says to me that your comfort is more important than mine, and that your time is worth more than mine and everyone else's, combined.
In Firefox, I have disabled web fonts, and use Libertine everywhere. That choice is denied to me in Firefox on my phone.
[+] [-] mntmn|7 years ago|reply
[+] [-] wongarsu|7 years ago|reply
[+] [-] stev0lution|7 years ago|reply
[+] [-] azinman2|7 years ago|reply
[+] [-] argimenes|7 years ago|reply
[+] [-] rayalez|7 years ago|reply
Do you think this font would be a good choice for a text editor?
[+] [-] 676339784|7 years ago|reply