Innovative 'variable fonts' offer more style variations at potentially smaller file size

Innovative 'variable fonts' offer more style variations at potentially smaller file size
0

Maybe I have been living under a rock, but I have only learned about this yesterday and thought I would share it with you guys.

Well, an images says more than … and an animated one is even better:

So it’s a new type of font file that includes all the font weights and variations in one file. Actually only the ‘regular’ and the extreme cases of a variation are there, and the ones in between are generated. e.g. font weight, that would be regular, thin and bold included and the rest generated:

Besides that, letter width, height, slant/italic can be variations, but also custom properties.

Playground
https://v-fonts.com/

Variable Google Fonts
https://fonts.google.com/?sort=date&vfonly

Guides:
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide

https://developers.google.com/web/fundamentals/design-and-ux/typography/variable-fonts