OpenType Features Playground
Explore and test OpenType features in your fonts. Toggle features on/off and see the effect in real-time.
About OpenType Features
What are OpenType Features?
OpenType features are typographic capabilities built into fonts. They allow designers to access alternate glyphs, ligatures, small caps, and other advanced typography options through CSS.
Common Features
liga - Standard ligatures (fi, fl)
kern - Kerning adjustments
smcp - Small capitals
onum/lnum - Oldstyle/Lining figures
tnum/pnum - Tabular/Proportional figures
Frequently Asked Questions
How do I use these features in CSS?
You can use the font-feature-settings property. The tool generates this code for you automatically in the "CSS Output" section. For example: font-feature-settings: "liga" 1, "smcp" 1;
Why are some features greyed out?
The tool automatically detects which features are actually present in your uploaded font file. If a feature is not listed, it means the font designer did not include support for it in that specific file.
What is the difference between 'smcp' and 'c2sc'?
smcp (Small Capitals) turns lowercase letters into small caps (a → A). c2sc (Capitals to Small Caps) turns UPPERCASE letters into small caps (A → A).
Does this work with Variable Fonts?
Yes, but this tool focuses on OpenType "layout features" (GSUB/GPOS) like ligatures and alternates. For variable font axis testing (like Weight, Width), standard CSS controls are usually sufficient.