Bhinish Dhiman
Por que 16px não é 16px: a altura-x de 872 famílias de fontes
Traduzido do original em inglês. Ler o original
Em 872 famílias de fontes medidas pelas tabelas OS/2, a altura-x vai de 0.351 em (Suravaram) a 0.84 em (Matangi), com mediana de 0.500 em e faixa do 5º ao 95º percentil de 0.411 a 0.570. Igualar a altura-x da Helvetica em 16px exige 15.2 px na Inter, 18.6 px na Times New Roman e 20.8 px na EB Garamond.
font-size: 16px define a altura de uma caixa invisível. O que o leitor vê são as minúsculas dentro dela, e o quanto da caixa as minúsculas ocupam é uma propriedade do tipo de letra. Tínhamos as medidas de 872 famílias na nossa tabela de métricas de fontes, então calculamos a distribuição.
O termo
Altura-x (x-height) é a altura de uma letra minúscula sem ascendente nem descendente, como o x, o a e o e, expressa como fração do em, a caixa que o font-size define. Uma fonte com altura-x de 0.5 em, a 16px, tem minúsculas de 8 px de altura. É a medida isolada que melhor prevê o quanto um texto parece grande, e é justamente a que o CSS não deixa você definir.
A medição
O src/lib/type/font-metrics.json é gerado a partir do @capsizecss/metrics 4.3.0, que lê a tabela OS/2 de cada fonte. O build mantém as famílias sans-serif, serifadas e monoespaçadas, exclui as famílias Noto e Material específicas de cada escrita e exclui 48 famílias cujos arquivos não informam altura-x ou informam uma abaixo de 0.35 em, o que deixa 872. Calculamos os percentis, a proporção por categoria e, para cada família, o tamanho em pixels que dá a mesma altura de minúsculas que a Helvetica a 16px; a Helvetica mede 0.523 em, contra a referência de 0.52 em em que a tabela de fontes do APCA é calibrada. Cálculo feito em 1º de outubro de 2026.
| Percentil | Altura-x (em) | Tamanho para igualar a Helvetica a 16px |
|---|---|---|
| Mínimo | 0.351 | 23.7 px |
| 5º | 0.411 | 20.3 px |
| 10º | 0.440 | 18.9 px |
| 25º | 0.478 | 17.4 px |
| Mediana | 0.500 | 16.6 px |
| 75º | 0.524 | 15.9 px |
| 90º | 0.546 | 15.2 px |
| 95º | 0.570 | 14.6 px |
| Máximo | 0.840 | 9.9 px |
Entre o 5º e o 95º percentil, o mesmo tamanho nominal produz minúsculas que diferem por um fator de 1.39. Entre os extremos, 2.39.
A que distância as famílias ficam da referência
166 famílias, ou 19.0%, têm altura-x mais de 10% abaixo de 0.52 em. 39 famílias, 4.5%, ficam mais de 10% acima. Só 458, ou 52.5%, estão a até 5% dela. A referência descreve cerca de metade do catálogo; uma tabela de tamanhos mínimos calibrada nela está silenciosamente errada para a outra metade, e errada no sentido de pequena demais para uma família em cada cinco.
As medianas por categoria diferem menos do que a dispersão dentro de cada uma: sans-serif 0.508, serifadas 0.479, monoespaçadas 0.518. As serifadas ficam mais baixas em média porque a tradição old-style é pequena, mas a Merriweather, uma serifada, está em 0.556, e a Josefin Sans, uma sans, em 0.378.
Famílias conhecidas
| Família | Altura-x (em) | Tamanho para igualar a Helvetica a 16px |
|---|---|---|
| Merriweather | 0.556 | 15.0 px |
| Inter | 0.546 | 15.2 px |
| Verdana | 0.545 | 15.3 px |
| Roboto | 0.528 | 15.8 px |
| Helvetica | 0.523 | 15.9 px |
| Arial | 0.519 | 16.0 px |
| Lato | 0.506 | 16.4 px |
| Georgia | 0.481 | 17.3 px |
| Source Serif 4 | 0.475 | 17.5 px |
| Times New Roman | 0.447 | 18.6 px |
| Crimson Pro | 0.420 | 19.8 px |
| EB Garamond | 0.400 | 20.8 px |
| Cormorant Garamond | 0.386 | 21.6 px |
| Josefin Sans | 0.378 | 22.0 px |
A EB Garamond a 16px tem minúsculas de 6.4 px de altura. A Inter a 16px as tem com 8.7 px, ou seja, 37% mais altas, no mesmo tamanho declarado. Duas páginas que “usam texto de 16px” podem diferir em mais de um degrau inteiro de uma escala tipográfica naquilo que o leitor realmente recebe.
O topo da distribuição não é o que parece
As famílias acima de 0.7 em, como Matangi, Anton, Antonio e Bebas Neue, são fontes display condensadas. A Bebas Neue informa uma altura-x de 0.700 em contra uma altura de maiúsculas de 0.700 em, porque não tem minúsculas e o arquivo dela mede versaletes no lugar; a Anton e a Antonio desenham minúsculas quase tão altas quanto as maiúsculas. “Altura-x grande” nessa ponta significa uma fonte de título, não uma fonte de texto generosa. O limite superior real para texto fica em torno de 0.55 a 0.58 em: Merriweather, Poppins, Oswald.
O que isso significa para um tamanho mínimo
A tabela do APCA dá um tamanho mínimo em cada nível de contraste para uma fonte próxima da referência, e a documentação dele manda ajustar esse mínimo multiplicando-o por 0.52 dividido pela altura-x da sua fonte. A tabela acima é essa correção, já calculada. Para a família mediana, é um ajuste de 4%; para o 5º percentil, de 27%; para a EB Garamond, de 30%. Nosso verificador de legibilidade tipográfica aplica essa correção a partir das mesmas métricas, então o mínimo que ele informa vale para a família que você escolheu, e não para a Helvetica.