Variable Fonts: The Future of Web Type (2016)

The future of web type since 2016 has been sad. I still disable web fonts due to their average lower quality compared to system fonts. Private websites tend to fare much better to big media outlets here: it's rare to find good readable fonts that don't just scream "loud type"...

Maybe even worse than that is that the font rendering I get out of newer Firefox releases (70+) or any Chromium version on linux is not on-par with system font rendering on linux.

I'm extremely picky when it comes down to font rendering. I read all day and I tweaked font rendering precisely to my desire. I can spot the difference between autohinting and native hinting on some fonts just by a cursory glance on a 200dpi display. Chrome/chromium completely ignores that and gives me a horrific view of pretty much any font. Firefox hasn't been that bad until 70+, but if you try to enable webrender it becomes just as bad as chrome.

You know what a web browser should do first and foremost _right_? Text rendering. I don't care about Web Type, Open Type or any other font feature until the font that looks perfect on my editor is rendered like shit on a browser. Browser performance is worthless if I cannot read text clearly.

I look forward to when variable fonts work well on all systems. (I really like rsms.me/inter)

Meantime, rocking the system font.

https://tachyons.io/docs/typography/font-family/system-sans-...

https://css-tricks.com/snippets/css/system-font-stack

So when, and how, can we start using this? Are there any examples or tutorials available? Or is it so new browsers don't support it yet?

This seems similar to Knuth's Metafont.