Mengapa 16px tidak selalu 16px: x-height di 872 keluarga font

font-size: 16px menetapkan tinggi sebuah kotak tak terlihat. Yang dilihat pembaca adalah huruf kecil di dalamnya, dan seberapa besar bagian kotak yang diisi huruf kecil itu adalah sifat dari typeface-nya. Kami punya hasil pengukuran untuk 872 keluarga font di tabel metrik font kami, jadi kami menghitung distribusinya.

Istilahnya

x-height adalah tinggi huruf kecil tanpa ascender atau descender, seperti x, a, dan e, yang dinyatakan sebagai pecahan dari em, yaitu kotak yang ditetapkan font-size. Typeface dengan x-height 0.5 em pada 16px memiliki huruf kecil setinggi 8 px. Inilah satu ukuran yang paling baik memprediksi seberapa besar sebuah teks terlihat, dan justru ukuran inilah yang tidak bisa Anda atur lewat CSS.

Pengukurannya

src/lib/type/font-metrics.json dibangun dari @capsizecss/metrics 4.3.0, yang membaca tabel OS/2 setiap font. Proses build mempertahankan keluarga sans-serif, serif, dan monospace, mengecualikan keluarga Noto dan Material yang khusus untuk aksara tertentu, serta mengecualikan 48 keluarga yang file-nya tidak melaporkan x-height atau melaporkan nilai di bawah 0.35 em, sehingga tersisa 872. Kami menghitung persentil, porsi per kategori, dan untuk setiap keluarga, ukuran piksel yang menghasilkan tinggi huruf kecil yang sama dengan Helvetica pada 16px. Helvetica terukur 0.523 em, dibandingkan acuan 0.52 em yang menjadi dasar kalibrasi tabel lookup font APCA. Dihitung pada 1 Oktober 2026.

Persentil	x-height (em)	Ukuran untuk menyamai Helvetica 16px
Minimum	0.351	23.7 px
Ke-5	0.411	20.3 px
Ke-10	0.440	18.9 px
Ke-25	0.478	17.4 px
Median	0.500	16.6 px
Ke-75	0.524	15.9 px
Ke-90	0.546	15.2 px
Ke-95	0.570	14.6 px
Maksimum	0.840	9.9 px

Di antara persentil ke-5 dan ke-95, ukuran nominal yang sama menghasilkan huruf kecil yang berbeda hingga faktor 1.39. Di antara kedua ekstremnya, 2.39.

Seberapa jauh keluarga font dari acuan

166 keluarga, atau 19.0%, memiliki x-height lebih dari 10% di bawah 0.52 em. 39 keluarga, 4.5%, berada lebih dari 10% di atasnya. Hanya 458, atau 52.5%, yang berada dalam rentang 5% darinya. Acuan itu menggambarkan sekitar separuh katalog; tabel ukuran minimum yang dikalibrasi dengannya diam-diam keliru untuk separuh sisanya, dan kelirunya ke arah terlalu kecil untuk satu dari lima keluarga.

Median antarkategori berbeda lebih sedikit daripada sebaran di dalam masing-masing kategori: sans-serif 0.508, serif 0.479, monospace 0.518. Serif rata-rata lebih rendah karena tradisi old-style cenderung kecil, tetapi Merriweather, sebuah serif, berada di 0.556 dan Josefin Sans, sebuah sans, berada di 0.378.

Keluarga font tertentu

Keluarga	x-height (em)	Ukuran untuk menyamai Helvetica 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 pada 16px memiliki huruf kecil setinggi 6.4 px. Inter pada 16px memilikinya setinggi 8.7 px, 37% lebih tinggi, pada ukuran deklarasi yang sama. Dua halaman yang sama-sama “memakai teks isi 16px” bisa berbeda lebih dari satu tingkat penuh skala tipografi dalam hal apa yang benar-benar diterima pembaca.

Puncak distribusi tidak seperti kelihatannya

Keluarga di atas 0.7 em, yaitu Matangi, Anton, Antonio, dan Bebas Neue, adalah display face yang condensed. Bebas Neue melaporkan x-height 0.700 em dengan cap height 0.700 em, karena tidak punya huruf kecil dan file-nya mengukur small caps sebagai gantinya; Anton dan Antonio menggambar huruf kecil yang hampir setinggi huruf kapitalnya. “x-height besar” di ujung itu berarti typeface untuk judul, bukan typeface teks yang lega. Ujung atas yang sebenarnya untuk teks ada di sekitar 0.55 hingga 0.58 em: Merriweather, Poppins, Oswald.

Artinya bagi ukuran minimum

Tabel lookup APCA memberikan ukuran minimum di setiap tingkat kontras untuk font yang mendekati acuan, dan dokumentasinya menyarankan untuk menskalakan ukuran minimum itu dengan 0.52 dibagi x-height font Anda. Tabel di atas adalah koreksi itu, yang sudah dihitung sebelumnya. Untuk keluarga di median, penyesuaiannya 4%; untuk persentil ke-5, 27%; untuk EB Garamond, 30%. Type legibility checker kami menerapkannya dari metrik yang sama, jadi ukuran minimum yang dilaporkannya berlaku untuk keluarga font yang Anda pilih, bukan untuk Helvetica.