OpenType Figures & Numerals

Eugene Tantsurin

·

5 minute read

·

Updated

Comparison of proportional and tabular figures in Resist Sans

OpenType features are built-in typographic functions that let you change how characters appear without switching to a different typeface. For numerals, these features control figure styles, fractions, superscripts, subscripts, and other details used in design and typography.

This guide focuses on OpenType figures and numerals. It explains how the different figure styles work, where to find them in common design applications, and how to use selected features on the web with CSS. The available options vary by typeface, so check the family’s feature list before choosing a font.

In this guide, we’ll explain the main OpenType figure features and answer these questions:

What are OpenType features? 
Why are there multiple sets of figures in a font? 
How to use OpenType figures? 
How to choose a typeface with OpenType font features?
And, finally, how to access OpenType features?

Lining Figures

Lining figures in Lader typeface

Most people think of lining figures as the default style of numerals. They are designed to reach approximately the height of capital letters, with proportions and stroke weights that complement uppercase text. Lining figures are commonly used for data sets, prices, price tags, headings, interfaces, and street signs.

Lining figures are often a good choice when clarity and visual uniformity are important. They create a consistent vertical alignment with capital letters, although their individual widths may still vary unless the typeface also provides tabular figures. In many typefaces, lining figures are the default numeral style, but this is not guaranteed, so check the font’s OpenType feature list.

The OpenType feature is called Lining Figures and uses the four-character tag lnum. In design applications, it can usually be enabled from the OpenType or Character panel. On the web, use:

.example {
  font-variant-numeric: lining-nums;
}
.example {
  font-variant-numeric: lining-nums;
}
.example {
  font-variant-numeric: lining-nums;
}


You can also enable the feature with the lower-level CSS property:

.example {
  font-feature-settings: "lnum";
}
.example {
  font-feature-settings: "lnum";
}
.example {
  font-feature-settings: "lnum";
}

Use lining figures when numerals need to sit comfortably alongside uppercase letters or create a clear, structured appearance. For columns of numbers that must align vertically, combine them with Tabular Figures using font-variant-numeric: lining-nums tabular-nums;.


Tabular Figures

Tabular figures in the Resist Mono typeface

As the name suggests, tabular figures are designed for tables, airport and train schedules, price lists, invoices, financial data, and other layouts that require precise numerical alignment. The main feature of tabular figures is that every numeral occupies the same horizontal width, making it easier to align values vertically in columns.

Tabular figures control the width of the numerals, not their height or vertical style. They can be combined with lining figures or oldstyle figures. For example, lining tabular figures align with capital letters, while oldstyle tabular figures follow the proportions of oldstyle numerals.

In most modern design applications, you can enable tabular figures by selecting the text frame and choosing Tabular Figures in the OpenType panel. The OpenType feature uses the four-character tag tnum. For web designers, use:

.example {
  font-variant-numeric: tabular-nums;
}
.example {
  font-variant-numeric: tabular-nums;
}
.example {
  font-variant-numeric: tabular-nums;
}

You can also enable the feature with the lower-level CSS property:

.example {
  font-feature-settings: "tnum";
}
.example {
  font-feature-settings: "tnum";
}
.example {
  font-feature-settings: "tnum";
}

Some typefaces also include tabular versions of punctuation marks used alongside numerals, such as commas, periods, colons, and parentheses. The Lader type family includes tabular punctuation to help maintain consistent alignment in data-heavy layouts.


Oldstyle Figures

Oldstyle figures in the Oktah Round typeface

Oldstyle figures are numerals designed to harmonize with lowercase text. Instead of sharing a uniform height, they use varying ascender and descender positions: some figures rise toward the cap height, while others sit near or extend below the baseline. This variation gives paragraphs a more natural rhythm and keeps numerals from competing with the surrounding letters.

Oldstyle figures are especially useful in books, editorial layouts, captions, and other forms of running text. They are commonly associated with serif typefaces, but many sans serif families also include them. The exact shape and height of each numeral varies by typeface, so the figure set should be evaluated within the context of the complete font and the project you're working on.

The OpenType feature is called Oldstyle Figures and uses the four-character tag onum. In Adobe and other design applications, it can usually be enabled from the OpenType or Character panel. On the web, use:

.example {
  font-variant-numeric: oldstyle-nums;
}
.example {
  font-variant-numeric: oldstyle-nums;
}
.example {
  font-variant-numeric: oldstyle-nums;
}

You can also enable the feature with the lower-level CSS property:

.example {
  font-feature-settings: "onum";
}
.example {
  font-feature-settings: "onum";
}
.example {
  font-feature-settings: "onum";
}

Tabular Oldstyle Figures

Tabular oldstyle figures in the Resist Mono typeface

Tabular oldstyle figures combine two OpenType features: the varying heights of oldstyle numerals and the equal widths of tabular numerals. This combination is useful when a layout needs the visual rhythm of oldstyle figures while numerical values still need to align in columns.

They are well suited to tables, financial documents, schedules, historical publications, and other data-heavy layouts where both typographic character and precise alignment matter. The equal-width design keeps columns organized, while the ascender and descender structure allows the numerals to sit more naturally alongside lowercase text.

The OpenType features are Oldstyle Figures (onum) and Tabular Figures (tnum). In design applications, enable both options from the OpenType or Character panel. On the web, use:

.example {
  font-variant-numeric: oldstyle-nums tabular-nums;
}
.example {
  font-variant-numeric: oldstyle-nums tabular-nums;
}
.example {
  font-variant-numeric: oldstyle-nums tabular-nums;
}

The equivalent lower-level declaration is:

.example {
  font-feature-settings: "onum", "tnum";
}
.example {
  font-feature-settings: "onum", "tnum";
}
.example {
  font-feature-settings: "onum", "tnum";
}

Availability and design quality vary by typeface, so check the specimen before using tabular oldstyle figures in a production layout.

Fractions, Numerators and Denominators

OpenType fractions in the Lader typeface

In a fraction, the numerator is the number above the dividing line and the denominator is the number below it. OpenType fraction features replace standard numerals with smaller, purpose-built figures and position them correctly, creating a more balanced result than simply reducing the size of ordinary numbers.

The size and proportions of these figures vary by typeface. Numerators are generally positioned toward the cap-height area, while denominators sit closer to the baseline. Their spacing, alignment, and overshoots are carefully adjusted to work with the design of the complete typeface.

Not every font includes a complete fraction set. Some families provide precomposed fraction glyphs, while others generate fractions through OpenType substitutions. Check the font’s feature list or glyph map to confirm what is included.

The OpenType feature is called Fractions and uses the four-character tag frac. The related tags are numr for numerators and dnom for denominators. In design applications, enable Fractions from the OpenType or Character panel.

On the web, use:

.example {
  font-variant-numeric: diagonal-fractions;
}
.example {
  font-variant-numeric: diagonal-fractions;
}
.example {
  font-variant-numeric: diagonal-fractions;
}

The lower-level equivalent is:

.example {
  font-feature-settings: "frac";
}
.example {
  font-feature-settings: "frac";
}
.example {
  font-feature-settings: "frac";
}

Fractions are useful in recipes, measurements, technical documents, product specifications, and other layouts where numerical information needs to remain compact and typographically consistent.

Superiors and Inferiors

Superscript and subscript figures in the Arlen typeface

Superscript and subscript figures are smaller numerals designed for specialized notation. Superscripts are positioned above the baseline, while subscripts, also called inferiors, are placed below it. Unlike numerators and denominators, they are not intended specifically for displaying fractions.

These figures are commonly used in mathematical formulas, chemical notation, footnotes, references, ordinal numbers, and technical writing. For example, a superscript can be used to write an exponent such as 2⁴, while a subscript can identify a chemical formula such as H₂O.

The size, weight, and placement of these figures are carefully adjusted for each typeface. Simply reducing the size of standard numerals can produce figures that look too thin or poorly aligned. The exact availability and design quality vary by font family, so check the font’s feature list before using them.

The OpenType features are Superscript Figures (sups) and Subscript Figures (subs). In design applications, they can usually be enabled from the OpenType or Character panel.

For web projects, use the lower-level OpenType tags:

.superscript {
  font-feature-settings: "sups";
}

.subscript {
  font-feature-settings: "subs";
}
.superscript {
  font-feature-settings: "sups";
}

.subscript {
  font-feature-settings: "subs";
}
.superscript {
  font-feature-settings: "sups";
}

.subscript {
  font-feature-settings: "subs";
}

You can also use the CSS font-variant property where browser and font support allow it:

.superscript {
  font-variant-position: super;
}

.subscript {
  font-variant-position: sub;
}
.superscript {
  font-variant-position: super;
}

.subscript {
  font-variant-position: sub;
}
.superscript {
  font-variant-position: super;
}

.subscript {
  font-variant-position: sub;
}

Circled Figures

Circled figures in the Resist Mono typeface

Circled figures are numerals enclosed within circular shapes. They can be useful for numbered labels, diagrams, instructions, interfaces, wayfinding, and display typography where a number needs to function as a visual marker as well as a character.

Circled figures may be included as dedicated Unicode characters, stylistic alternates, or separate glyphs in a font’s character set. Unicode provides both filled and unfilled enclosed-number characters, while type designers may add additional versions that match the style of the typeface. In Groteskly Yours Studio collection, circled figures may be provided as separate glyphs with their own Unicode values or as stylistic alternates to the default numerals.

The way these figures are accessed depends on the typeface. In some fonts, they can be selected from the Glyphs panel or character map; in others, they may be available through a stylistic set or an OpenType feature. Check the individual font’s specimen and glyph map to see which circled figures are included and how to use them.

Circled figures are most effective when numerals need to stand out as badges, markers, or graphic elements rather than operate only as ordinary text. Since their proportions and spacing vary between typefaces, test them in the final layout before using them in a production design.

About the author

Eugene Tantsurin from Groteskly Yours Studio

Eugene is a Belgrade-based type designer. He developed an interest in type design after graduating from Bangkok University with a degree in Communication Arts in 2018. As a co-founder of Groteskly Yours Studio, he leads all type-related projects.

Eugene Tantsurin from Groteskly Yours Studio

Eugene is a Belgrade-based type designer. He developed an interest in type design after graduating from Bangkok University with a degree in Communication Arts in 2018. At GYS, he leads all type-related projects.