better-typography

Apply a small type scale with semantic names, map heading levels to descending scale steps, and cap line length around 60-75 characters. The Skill reviews your code and returns findings with severity, location, and before/after fixes in your project's styling system.

Use woff2, which offers Brotli compression and broad browser support. Keep woff only as a fallback for very old browsers, and avoid serving raw ttf or otf files since they have no web compression.

Apply font-variant-numeric: tabular-nums (the tabular-nums utility in Tailwind) to timers, counters, and prices. This gives every digit equal width so updating values no longer cause layout shift.

Yes. Every CSS declaration covered maps to a Tailwind equivalent in the included cheat sheet, such as text-balance, text-pretty, tabular-nums, and antialiased. Fixes are always expressed in the styling system the project already uses.

iOS Safari zooms the page when input text is smaller than 16px. Set inputs to text-base on mobile and sm:text-sm from the small breakpoint up, and avoid the maximum-scale=1 viewport meta since it blocks pinch zoom and fails WCAG.

Prefer font-weight and other high-level properties because they keep working with non-variable fallback fonts. Reserve font-variation-settings for custom axes like GRAD that have no corresponding CSS property.