Unica77 LL
Before
Introduction
The text within a button is not always centered vertically. That is the font’s fault, not yours. Of course, you can already trim the line box in CSS with text-box: trim-both cap alphabetic. That property became a cross-browser friendly option on August 18, 2026, when Firefox adopted it. But the default is still the untrimmed box, and component kits were written for that default.
My tool rewrites the font for that default case. It only changes how the word sits in the box: not the letters, the look of the font, its rhythm or anything else.
How it works
It makes the leftover above the caps equal the leftover below the baseline, so a one-word label sits in the middle of equal padding. Spare height the file already has is used first, whether that is empty room in the line or extra leading. The line only grows when real descenders would not fit after that.
GUI solution
Drop a font file to fix this problem, see the measurements, then download the rewritten font. You can also try three selected fonts at the bottom, and see how the tool impacted them: I’ve selected fonts I admire and would like to use in my work, but their metrics are a bit off by default: Unica77 LL by Lineto, GT America by Grilli Type, and BST Ritma by British Standard Type.
Unica77 LL
Metrics comparison
Uploading and analyzing
Before
Unica77 LL
Within a button
Uploading and analyzing
Before
Unica77 LL
Text sample
Uploading and analyzing
Before
CLI solution
Install with npm, then point it at a file or a folder. A folder means every .otf, .ttf, .woff, and .woff2 inside it. It writes a normalized copy next to the original.
npm i -g normalize-metrics normalize-metrics Inter-Regular.otf normalize-metrics ./fonts
Or once, without installing:
npx normalize-metrics ./fonts
In a repo, add it as a dev dependency and list the folders in the config. --check reports fonts that are still off and exits without writing.