
An Introduction to Variable Fonts (2019) - todsacerdoti
https://24ways.org/2019/an-introduction-to-variable-fonts/
======
bcks
There's a wonderful, interactive playground of variable fonts up at
[https://v-fonts.com](https://v-fonts.com). Most variable fonts let you
interpolate font weight, width, or slant, but some go much further. See for
instance, [http://variableemojis.com](http://variableemojis.com)

------
rememberlenny
FWIW - I worked on Google Fonts for the last 18 months. Happy to answer any
questions.

In short: rather than having a single font file for every weight, variable
fonts take in a variable (ie. weight, width, optical size, etc) and can render
the fonts glyph at a specific design space. This means instead of having three
files for thin, normal and bold, you can have one slightly large file that can
render thin, bold, and everything better.

~~~
codenamepod
Is it good for web usage? 400,400i,700,700i fonts' file sizes combined is
still less than one variable fonts'size. Isn't that true?

~~~
rememberlenny
Its great for web usage but the context matters. It's not so black or white.

The font file that displays a weight is using a "master". Often an extreme
expression of a font (thin/bold) is based on a master. The in between weights
(normal/medium) can be interpolated without an explicit master. So you can get
now just Roboto 200, but also Roboto 220, 250, 300, 315.

When the variable font file has many masters, then it has the possibility to
be bigger than having individual fonts. This is why its not so straight
forward.

In the case that you have an italic font, for example, you might need a
specific master for the italic and the normal size.

The cases where it is smaller to use a variable font is when you have multiple
weights that can be interpolated from less masters in the font file, than you
would need font files. For example, having 300, 400, 600 font weight used in a
variable file could be smaller if the 300/400/600 weights are all interpolated
from the 400 weight master. This way the fonts thin/bold masters could be
removed from the font.

Google Fonts team does some really cool stuff around this, where they minimize
the size of the file being sent down the wire based on your browsers
capability.

TLDR: Variable fonts can be faster. When it is, it's a lot faster. But its not
black and white, so there isn't a straight forward way to know.

------
kevbin
[https://tidbits.com/1994/09/26/preliminary-practical-
primer-...](https://tidbits.com/1994/09/26/preliminary-practical-primer-to-
quickdraw-gx-part-iii/)

------
ladyanita22
It baffles me so few programs support these.

~~~
Wistar
Adobe Illustrator does and I use the heck out of it, particularly with the
Adobe Variable Acumin font. So useful.

~~~
ladyanita22
I know the Adpbe suite does support them, but what about Microsoft Word or
Apple Pages? I would say variable fonts are the future.

~~~
Wistar
I just tested it out with MS Word and the variable fonts do not show up in the
list of available fonts within Word.

Boo.

~~~
mmmrk
They should show up with their individual styles, but you can't variate them.
They need to contain a STAT table to work on Windows though.

~~~
Wistar
Hmm. Although it shows up in Illustrator, Photoshop and InDesign, it does not
make an appearance in the MS Word font list, either as a master or as
individual styles.

~~~
mmmrk
Adobe apps don't need a STAT afaik, Microsoft apps do.

