Font rendering fixture

Arabic heading comparison

The same production markup is rendered in every card. Adjust the controls to compare weight matching, shaping, and line metrics.

Checking fonts…

Declaration under test

Why the current rule is suspect

Currentfont-weight: 100 700 900;
Static faces400 + 700

A weight descriptor accepts one weight for a static face or two endpoints for a variable-font range. Three values invalidate the descriptor.

SF Mada: current rule

100 700 900

الجهات المشاركة من جميع أنحاء العالم

Reproduces the three-value descriptor with the normal file.

SF Mada: corrected single face

400

الجهات المشاركة من جميع أنحاء العالم

Maps the normal static file to its actual weight.

SF Mada: normal + bold

400 / 700

الجهات المشاركة من جميع أنحاء العالم

Recommended mapping for the two static files in this fixture.

Lyon Arabic Display

400

الجهات المشاركة من جميع أنحاء العالم

The regular display face. A requested 500 resolves to 400.

Lyon Arabic Text

400 / 600

الجهات المشاركة من جميع أنحاء العالم

Regular and semibold faces make weight matching visible.

System fallback

sans-serif

الجهات المشاركة من جميع أنحاء العالم

Baseline for spotting loading failures and fallback changes.

Show exact markup
<h2 class="w-full text-h4 font-heading font-medium [&amp;_em]:italic [&amp;_strong]:font-bold [&amp;_br]:block">الجهات المشاركة من جميع أنحاء العالم</h2>