Home › Blog › Archive by category: Variable Fonts

Variable Fonts

How to animate variable fonts using Python and Drawbot

One of the most common uses of variable fonts is to make animations. You probably have already seen it: fonts that gain and lose weight, get wider and narrower, or even morph between a normal font and a stencil version, always incredibly smoothly.

You don’t need to buy expensive software to do that. In fact, a lot of these images are made in Drawbot, a free application for MacOS. Although Drawbot was initially developed as a tool for learning to code in Python, the fact that it can export in PDF, SVG, PNG, MP4, GIF and other formats made it an excellent tool for automating tasks in graphic design. You can even typeset a whole book in it and then export it as a print-ready PDF with CMYK colors!

Malva 2.0: variable font update

Version 2.0 of Malva is here and it comes with variable fonts! If you don’t know what that means, variable fonts are one of the most exciting new developments in digital typography in the last few years. This new format allows you to have many styles in a single font file. All styles are organised along axes, which means you now have the ability to select the exact weight value you need (or any other variation the font might have). No more wishing the bold was slightly bolder and the regular was a little lighter!

Rocher Color: making a variable color font

Stacking multiple fonts on top of each other is a makeshift solution for creating multicolored text in digital media. I was well aware of this when I designed Rocher. On the other hand, I so excited about it I couldn’t keep myself from releasing it even knowing the user experience would be subpar.

Things have been changing rapidly since then. Support for color fonts has seen a considerable increase in the last couple of years. On top of that, variable fonts technology has opened up another plethora of possibilities. Merit Badge, by David Jonathan Ross, was the typeface that inspired me to go into this rabbit hole and release Rocher Color. This is its story.