🖋️font-variant Generator
A figure of 50 states stood at 1234 feet (fi fl st 0)
Modern fonts often come with powerful OpenType features that allow for advanced typographic control. The `font-variant` CSS property gives you access to these features. This tool lets you visually toggle common options like ligatures, small caps, and different numeral styles. You can type your own text to see exactly how specific character combinations (like 'fi' or '0') render with these features enabled.
Frequently Asked Questions
What are ligatures?
Ligatures are special characters that combine two or more letters into a single glyph for a more harmonious appearance. Common examples are 'fi' and 'fl'.
Why don't I see a change when I check a box?
For a `font-variant` property to have a visible effect, the font you are using must include the corresponding OpenType feature. The preview text uses Google's 'Source Serif 4', which supports many of these features.

