Bhinish Dhiman
Por qué 16px no son 16px: la altura de la x en 872 familias tipográficas
Traducido del original en inglés. Leer el original
En 872 familias tipográficas medidas a partir de sus tablas OS/2, la altura de la x va de 0.351 em (Suravaram) a 0.84 em (Matangi), con una mediana de 0.500 em y una franja entre los percentiles 5 y 95 de 0.411 a 0.570. Igualar la altura de la x de Helvetica a 16px exige 15.2 px en Inter, 18.6 px en Times New Roman y 20.8 px en EB Garamond.
font-size: 16px define la altura de una caja invisible. Lo que ve el lector son las minúsculas que hay dentro, y cuánto de la caja ocupan esas minúsculas es una propiedad de la tipografía. Teníamos las medidas de 872 familias en nuestra tabla de métricas de fuentes, así que calculamos la distribución.
El término
La altura de la x es la altura de una letra minúscula sin ascendente ni descendente (la x, la a, la e), expresada como fracción del em, la caja que define font-size. Una tipografía con una altura de la x de 0.5 em a 16px tiene minúsculas de 8 px de alto. Es la medida que mejor predice qué tan grande se ve un texto, y es justo la que CSS no te deja definir.
La medición
src/lib/type/font-metrics.json se genera a partir de @capsizecss/metrics 4.3.0, que lee la tabla OS/2 de cada fuente. El proceso conserva las familias sans serif, serif y monoespaciadas, excluye las familias Noto y Material específicas de un sistema de escritura, y excluye 48 familias cuyos archivos no declaran altura de la x o declaran una inferior a 0.35 em, lo que deja 872. Calculamos los percentiles, el reparto por categoría y, para cada familia, el tamaño en píxeles que da la misma altura de minúsculas que Helvetica a 16px; Helvetica mide 0.523 em, frente a la referencia de 0.52 em con la que está calibrada la tabla de fuentes de APCA. Calculado el 1 de octubre de 2026.
| Percentil | Altura de la x (em) | Tamaño para igualar 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 los percentiles 5 y 95, el mismo tamaño nominal produce minúsculas que difieren en un factor de 1.39. Entre los extremos, de 2.39.
Qué tan lejos de la referencia quedan las familias
166 familias, el 19.0%, tienen una altura de la x más de un 10% por debajo de 0.52 em. 39 familias, el 4.5%, quedan más de un 10% por encima. Solo 458, el 52.5%, están dentro de un 5% de ella. La referencia describe más o menos la mitad del catálogo; una tabla de tamaños mínimos calibrada con ella se equivoca sin hacer ruido con la otra mitad, y se equivoca por quedarse corta en una de cada cinco familias.
Las medianas por categoría difieren menos que la dispersión dentro de cada una: sans serif 0.508, serif 0.479, monoespaciada 0.518. Las serif quedan más bajas en promedio porque la tradición de estilo antiguo tiende a ser pequeña, pero Merriweather, una serif, está en 0.556, y Josefin Sans, una sans serif, en 0.378.
Familias concretas
| Familia | Altura de la x (em) | Tamaño para igualar 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 |
EB Garamond a 16px tiene minúsculas de 6.4 px de alto. Inter a 16px las tiene de 8.7 px: un 37% más altas con el mismo tamaño declarado. Dos páginas que “usan texto de cuerpo de 16px” pueden diferir, en lo que el lector realmente recibe, en más de un paso completo de una escala tipográfica.
La parte alta de la distribución no es lo que parece
Las familias por encima de 0.7 em (Matangi, Anton, Antonio, Bebas Neue) son tipografías de exhibición condensadas. Bebas Neue declara una altura de la x de 0.700 em frente a una altura de mayúsculas de 0.700 em, porque no tiene minúsculas y su archivo mide en su lugar versalitas; Anton y Antonio dibujan minúsculas casi tan altas como sus mayúsculas. En ese extremo, “altura de la x grande” significa una tipografía para titulares, no una tipografía de texto generosa. El verdadero extremo superior para texto ronda los 0.55 a 0.58 em: Merriweather, Poppins, Oswald.
Lo que significa para un tamaño mínimo
La tabla de APCA da un tamaño mínimo para cada nivel de contraste en una fuente cercana a la referencia, y su documentación indica que hay que escalar ese mínimo por 0.52 dividido entre la altura de la x de tu fuente. La tabla de arriba es esa corrección, ya calculada. Para la familia mediana es un ajuste del 4%; para el percentil 5, del 27%; para EB Garamond, del 30%. Nuestro verificador de legibilidad tipográfica la aplica a partir de las mismas métricas, así que el mínimo que reporta corresponde a la familia que elegiste y no a Helvetica.