Learn How to Use Your New Fonts

Variable fonts and OpenType features solve two different problems in typography: making a single typeface work responsively across sizes and devices, and giving finer control over how text renders.

A variable font is a single file that contains every variation of weight, width, slant, and other design attributes, stored in a compact format. OpenType is font technology and file format developed by Microsoft and Adobe. OpenType predates variable fonts, which are a more recent addition to the format, offering finer control over typographic expression.

OpenType features: what they are and why they matter

OpenType is more than a container for letterforms. It supports features that give finer control over how text renders, including:

• Ligatures: Combine letter pairs like "fi" and "fl" into a single glyph.
• Small Capitals: Convert lowercase letters into small capitals, commonly used for titles and headlines.
• Old-Style Figures: Blend numerals with lowercase letters in running text, giving a more balanced look than lining figures, especially alongside small caps.
• Tabular Figures: Keep a consistent width across all digits, so numbers align vertically in tables, price lists, and similar layouts.
• Case-Sensitive Forms: Provide alternate glyphs designed to look better in text set in all caps or mixed with capitals.

These features matter because they let you fine-tune how text looks and reads, all from a single font file.

Real-world use cases with Tokotype fonts

Here's an example from one of our own typefaces. In Fonetika, switching on tabular figures makes every numeral the same width.

How to access OpenType features

OpenType features usually require software that supports them. Here's where to find them in a few common applications:

• Adobe Creative Suite (Photoshop, Illustrator, InDesign): Open the Character panel and find OpenType. It lists the available features you can switch on.
• Microsoft (Word, Excel, PowerPoint): Open the Font dialog box and go to the Advanced tab.
• Procreate: Select the font in the text style panel, then tap the glyph you want in the character map.
• Affinity (Designer & Publisher): Go to Text > Show Typography, or Format > Show Typography, depending on the version.

Not every OpenType font includes the same features. Which ligatures, alternates, and other options are available depends on the font you're using.

Variable fonts

Variable fonts are a different approach to font technology. Instead of separate files for each weight and style, like Regular, Bold, and Italic, one variable font file covers a range of axes:

• Weight: Ranges from thin to black.
• Width: Ranges from condensed to expanded.
• Slant / Italic: Shifts smoothly from upright to italic.
• Optical Size: Adjusts the font's appearance for different text sizes.

Variable fonts remove the need for multiple separate files, which keeps the total file size smaller. You can also adjust weight, width, or other attributes precisely, giving you more control over subtle typographic changes.

Using variable fonts in practice

Variable fonts have a few practical advantages beyond how they look:

• Consistency across platforms: A typeface stays consistent whether it's on a website, in an app, or on social media.
• Smaller file sizes: Storing everything in one file can improve a website's loading speed.
• Room to adapt: A brand's typography can adjust as the brand grows, without swapping in new font files.

Best practices and tips

To get the most out of OpenType features:

• Check which OpenType features a font actually includes. Specimen sheets or the software's OpenType panel will show you.
• Use decorative features sparingly. Too many can hurt readability.
• Test across platforms. If you're using variable fonts for websites or apps, check how they render and perform.
• Learn the variable axes available in a font and how each one changes its appearance.

Try exploring variable fonts and OpenType features in one of our typefaces. If you have questions, contact us at [email protected].