Connect

Better Typography

jakubkrehelbyjakubkrehel
•
8.8k
•
Design Tools

Reviews and refines web typography implementations across type scales, line heights, font features, wrapping rules, and punctuation.

Better Typography provides opinionated, production-grade rules and automated auditing heuristics to ensure digital text renders beautifully across devices and browsers. It guides AI code generation to eliminate common typographic bugs like synthesized fonts, pixel-based line heights, unconstrained line lengths, layout shifts on tabular data, and mobile input zoom issues on iOS Safari. By standardizing semantic type scales, proper CSS font properties over raw tags, balanced text wrapping, and smart punctuation, this skill ensures your typography communicates visual hierarchy clearly and cleanly within any CSS or Tailwind-based project.

Key Features

01Audits font loading and font-synthesis rules to prevent distorted pseudo-bold and faux-italic rendering
02Enforces strict type scale hierarchies, unitless line heights, and relative sizing standards
03Prevents mobile viewport zoom traps by enforcing 16px font sizes on form inputs
04Applies OpenType numeric features like tabular-nums for jump-free numbers and timers
05Optimizes line wrapping and measure using text-wrap balance and pretty rules
068,811 GitHub stars

Use Cases

01Building design systems with standardized, semantic type scales and responsive leading rules
02Polishing marketing pages, reading interfaces, and dashboards with professional OpenType features and smart punctuation
03Auditing existing CSS or Tailwind codebases to spot and fix typographic layout bugs and visual inconsistencies