News Header
2023.03.08

What is a variable font?

One file, unlimited options (almost!)

A variable contains multiple styles within it. Instead of installing separate files for each weight, style, width, variable fonts let you adjust these properties to suit your exact needs down to the exact pixel with just a single font file.

This innovation, introduced as part of the OpenType 1.8 specification in 2016, gives designers excellent flexibility while reducing file size and load times.



Common Axes in Variable Fonts

Most variable fonts include at least one of the following axes:

1. Weight – Adjusts the weighting.

2. Width – Expands or condenses the letterforms.

3. Slant – Tilts to it’s italic or slanted form.

4. Optical Size – Adjusts details for readability at different sizes.

With these axes, designers can fine-tune a typeface to fit their exact needs—whether it’s making text narrower for small mobile screens or bolder for a headline without manually switching fonts.


Why Variable Fonts Matter

1. Improved Performance

Since all styles exist within one file, websites and apps can reduce the number of font requests, improving load times. This is particularly valuable for mobile and low-bandwidth environments.

2. Responsive Typography

Variable fonts enable fluid design, adapting seamlessly across different devices and screen sizes. Need a slightly heavier weight for better contrast? Adjust the slider.

3. More Creative Control

Designers no longer need to stick to pre-defined styles like Regular, Bold, or Extra-Bold—they can create precise weights or widths tailored to their project.


4. Fewer File Management Issues

Gone are the days of managing dozens of separate font files. Variable fonts simplify file organisation, making them easier to use in large design systems.


Where can you use Variable Fonts?

Variable fonts are supported in most modern browsers and design software. You can experiment with them using CSS or design tools like Adobe, Figma, and Canva.



Our Variable Fonts:

Some of our most popular fonts are variable fonts like Tomato Grotesk, Wulkan, Gatch, Granda, Dysto, Brik and Halisa.