Axisize turns static fonts into a variable font right in your browser. There is nothing to install, your fonts never leave your device, and there is no analytics.

Four steps

The rail on the left (at the bottom on a phone) switches between them.

1. Font. Drop a TTF or OTF file (or click the drop zone); WOFF and WOFF2 need converting to TTF first. One file gives a variable font with Weight, Width and Slant axes, and every extreme — light, bold, narrow, wide, slanted — is synthesized from that single drawing: the outline is thickened, thinned, scaled and sheared. Several styles of one family become real masters (see below). Here you also set the family name; the page warns if the font’s license may not allow a derived font.
2. Check. What Axisize made on its own, with default settings. Move the axes (this only moves the view), edit the sample text, compare every extreme in one ladder and every size in the waterfall. If it looks right, press Export; if an extreme needs fixing, Fine-tune extremes.
3. Extremes. One tab per end of an axis, in pairs — Bold and Light, Condensed and Extended, Oblique and Backslant, the optical sizes — and the Worst corner, where every thickening meets at once (bold + condensed + slanted). Each tab shows that end of the real font you are building. Compare with the source puts the source line above each line of the extreme; Size sets the size of the sample. Under it are only the settings that shape that end; numbers and names that do not change the drawing are folded under Advanced, and the ? next to the title explains each setting. An orange dot on a tab means counters close there.
4. Export. The variable .ttf; a static style at the position you left on Check, with a style name you can edit; a whole family of static styles as a ZIP, named so that Word, Figma and InDesign group the files together. CSS for the web is a ready @font-face rule, and the build log shows what was done.

The font rebuilds half a second after any change. Big families (thousands of glyphs, several masters) take a few seconds; the page stays responsive and shows the current stage.

Settings

• Stem gain and reduction (Bold, Light) — how much thicker or thinner the main stems get, per side, as a share of the stem.
• Advance width growth (Bold) — how much of the extra thickness goes into letter width rather than eating into the space between letters.
• Condensed and Extended limits, Stem compensation — how narrow and wide the ends are, and how close the vertical stems stay to the source thickness while letters narrow or widen.
• Oblique and Backslant angles — 0° backslant removes backslant from the slant axis.
• Tracking — set per extreme, in 1/1000 em as in design apps: space after every letter at that end only; the styles in between get part of it.
• Counter protection keeps at least this share of every counter open when strokes thicken (bold, condensed), so “e”, “a”, “o” do not fill in; it also stops hairlines from vanishing in light and wide ends. Optical oblique turns round letters by a share of the slant angle instead of only shearing them, so “o”, “c”, “0” do not get pinched; straight stems keep the exact angle. Round squaring makes quarter-curves fuller in the condensed end, so “o” looks squarer rather than squeezed. Each has a switch to compare with and without it.
• Optical size (its own tab) adds a fourth axis that browsers set from the font size. The small end gets slightly heavier stems, thicker horizontals, looser spacing and optionally a larger x-height; the large end gets tighter spacing and finer hairlines.
• Under Advanced: the weight axis ends — the number and name the ends get in apps and CSS (700 Bold, 900 Black; the drawing stays the same); the weight curve — Even steps makes each step (300 → 400 → 500…) thicken the stem by the same ratio, as in hand-drawn families, Linear keeps plain interpolation; the style name of the right-leaning slant (Italic or Oblique); the point sizes of the optical-size axis and the source design size — the size the original font was drawn for.

Several fonts of one family: real masters

Drop several styles of the same family at once — say Regular and Bold, or Regular, Bold, Narrow and Narrow Bold. Their real letters become the masters of the variable font:

• Masters table (Font). Each file gets a position on the axes, read from the file itself (weight and width classes, italic angle, style names). A dashed field is a guess — check it. You can edit any value, make another master the default, remove a file or add more.
• Real and synthetic axes. An axis with at least two different masters (Regular 400 and Bold 700) is real: in-between weights interpolate the real drawings. Axes without real masters are synthesized from every real master. In Extremes, the tab of a real end names its master; its strength settings and tracking are hidden, because the end is the designer’s drawing. Extend by synthesis (Advanced) makes a real axis longer than the masters.
• Compatibility. To be interpolated, a letter must be drawn with the same structure in every master. The usual differences (contour order, direction, start point, number of points on a curve) are fixed automatically without changing the shape. Letters that still do not match are synthesized from the default master, with the strength fitted to the real masters. The report on the Font step counts them; See the list opens them in Check, where a click on a letter shows the real letter of every master next to what the variable font draws. Don’t use this master for this glyph excludes a master for one letter. Highlight synthesized glyphs (Check) shades these letters in the sample.
• Kerning and accents come from every real master: at a master’s position, the variable font kerns and places accents exactly like that master.
• Real italic. If some files are italic, you get two variable fonts, “Family” and “Family Italic”, linked so that design apps switch between them with the I button; Download gives both in one ZIP. Only if at least 90% of the letters match the upright ones can you choose one file with an ital axis instead. The synthetic slant axis is then off by default; the Oblique tab can add it.
• Only from default master (Worst corner, Advanced) synthesizes the secondary axes from the default master only: a much smaller file, but a narrow Bold is then the narrow Regular made bold rather than the real Bold made narrow.

What to expect

• Simple sans serifs synthesize best. High-contrast serifs and script faces are harder: the extremes look less refined than a hand-drawn family.
• Real masters are reproduced exactly: at a master’s position the variable font draws that master point for point. Synthesized letters and axes follow the stems and proportions of the masters, but they are not a type designer’s drawing — check frequent letters like “a”.
• Extreme settings (very bold, very condensed and strongly slanted at once) can squeeze small counters. Worst corner checks every corner of the axes and names the letters where a counter turns inside out.
• Letters that are not in your font (Cyrillic in a Latin-only font, say) are drawn by the browser with a fallback font. They are not part of the result; Check names them under the sample, and the built-in samples leave them out.

Licenses

Changing a font makes a new, derived font, and many licenses do not allow that. Fonts under the SIL Open Font License (OFL) do, but a Reserved Font Name must not be carried over — which is why the family is called “… Synth” by default. The page warns when a font has no OFL notice or has a Reserved Font Name. Check the license before you share or sell the result.

Donate

Axisize is free and has no ads. If it saved you an afternoon, you can thank the author on Ko-fi.