Design AtlasWhere a ligature (`liga`) is a rule for one fixed pair — "when fi sit together, always draw this shape" — contextual alternates (`calt`) can look at broader conditions. A script typeface might reshape a letter's connecting stroke to flow naturally from whatever precedes it, or swap in a slightly different alternate when the same letterform would otherwise repeat monotonously in a row.
In writing systems like Arabic, where a letter's shape changes completely depending on its position within a word (initial, medial, final), `calt` isn't decoration — it's required for correct rendering. In Latin type it's usually a subtle refinement most readers never consciously notice, even when it's active.
CSS's `font-variant-ligatures` controls it through the `contextual` keyword, on by default in most browsers (turn it off with `no-contextual`). The demo toggles this and measures whether the system font's rendered width actually changes — a Latin sans-serif system font may have few or no `calt` rules, in which case the demo reports that honestly rather than claiming an effect that isn't there.
When to use
Leave the default (on) alone. Consciously think about this feature only when working with a script — like Arabic — where positional letterforms are mandatory, not optional polish.