Numbers, fractions & ordinals

font-variant-numeric

Instructs the browser to use special glyphs for numbers, fractions and ordinals.

Property values

Specify one or more of these keywords:

tabular-nums Use equal width numbers suitable for use with tabular data
proportional-nums Use numbers with kerning
oldstyle-nums Use old-style alternates for 3, 4, 7 and 9 which have strokes that descend below the baseline
lining-nums Keep the bottoms of the numbers 3, 4, 7 and 9 flush with the bottoms of the other numbers
diagonal-fractions Separate the numerator and denominator with a slash, placing them adjacent to each other
stacked-fractions Separate the numerator and denominator with a horizontal line, stacking them one on top of the other
ordinal Use special glyphs for the ordinals 1st, 2nd, 3rd and 4th
slashed-zero Use an alternate glyph for the number zero with a slash through it, in situations where it needs to be distinguished from the capital letter "O"
normal Do not use any alternate numeric glyphs

Examples

font-variant-numeric: oldstyle-nums stacked-fractions;
font-variant-numeric
0

style > glyph > font-variant-numericNumbers, fractions & ordinals

🔗 🔎