What it does
Capsize is a typography library that creates CSS from font metrics. It supports trimming space around text, sizing by capital height and generating fallback font stacks.
When a label looks vertically misaligned beside an icon, CSS font size alone does not explain the visible capital height. Capsize can size text by that height and trim space above capitals and below the baseline. Install @capsizecss/core, supply the font metrics, then choose a CSS-in-JS style object or a stylesheet string for the output.
Choose either cap height or font size, and either line gap or leading. Combining both options in either pair is unsupported. Apply the generated styles to the text element and keep additional layout rules on a surrounding element, since those rules can interfere with the trim.
The metrics package contains data for system and Google fonts; the unpack package extracts it from another font file or URL. The fallback-stack helper accepts metrics in the intended font order and generates matching font-face overrides. It can also use a supported language subset when the default character weighting is unsuitable. Capsize is MIT-licensed and used through code, without a Capsize account.
Strengths
- Sizes text by visible capital height as well as CSS font size.
- Produces stylesheet strings or style objects.
- Includes tools for extracting metrics and preparing fallback styles.
Watch out for
- Layout rules on the trimmed element can interfere with the result.
- A custom font needs its own metrics.
Best for
- Design systems aligning text with icons
- Developers preparing typography and fallback styles
Sources
- Capsize README (Oct 27, 2026)
- Capsize MIT License (Oct 27, 2026)
