Variable Fonts Resources

An overview of an exploratory workshop conducted at the BBC R&D group with David Jonathan Ross to find out all the ways variable fonts could impact online news design.

A 24 Ways article introducing designers and developers to variable fonts, with practical tips on how to use them and where to find them.

An interesting look at the development of variable fonts and different user interface (UI) approaches to working with them.

A 24 Ways article covering intermediate variable-fonts maneuvers like special effects and animation.

The September 2016 Medium post announcing variable fonts.

A concrete look at use cases, implementation details, and performance gains using variable fonts on the web.

A 2015 A List Apart article outlining the need for, and presaging the arrival of, variable fonts.

Bianca Berning explains where the innovation came from, how it’s made, who its key players are, and where the medium might go next.

An introduction to variable fonts and how they benefit user experience (UX)

The first playground for variable fonts. Also includes a fantastic collection of resources organized chronologically to contextualize variable fonts historically—starting in 1991!

A combination of variable font playground and experiment in user interface design to work with them.

FontGoggles is a font viewer for various font formats. It is a free, open source desktop application for macOS that will preview available variable font axes and OpenType features (and much more).

Samsa is a web app that visualizes how variable fonts work. Use Samsa to open VFs, then inspect glyph outlines and other data to explore the designspace using sliders and other UI controls.

A “simple resource for finding and trying variable fonts.”

A sprawling resource from Type Network and Google offering a historical survey of variable fonts, detailed descriptions of what they can do, and demos.

A resource for developers and designers. Full of great demonstrations of custom axes and sensor/API integrations.

A collection of articles, talks, videos, and other resources on Jason Pamental’s site RWT.io

A playground and experimental site from the folks at Underware with a number of fonts with some very unique custom axis explorations.

A font-feature discovery tool. When you drop a font onto it, it itemizes the font’s features and spits out the CSS you need to use those features on the web.

From A Book Apart, a translation of classic typographic principles for the web.

A witty, comprehensive survey of typography.

A well-written book-as-website on web typography, updated to include variable fonts.

A presentation of typographic basics that drills down into practical examples, code snippets, and tips for making your type responsive and performant. For graphic designers, web designers, and front-end developers.

A small series of in-depth explorations of some typography basics.

An approachable introduction to typography.

Archive of an informative bulletin on web typography and variable fonts.

Video, slides, code, and resources on using variable fonts in dynamic typographic systems and editorial design on the web.

HOI, or Higher Order Interpolation, offers a new perspective on solving some of the more complex problems in shape interpolation in variable fonts.

An introduction to variable fonts, what we can do with them, and what problems they solve.

A look at different ways variable fonts can be used in conjunction with sensors, APIs, and other device capabilities.