Charles A Upsdell: Website DesignBrowser NewsCharles A Upsdell: Website Design

Page loading …ResourcesFonts

Synopsis: this page displays details about the with font weight.

This page is essentially a single-font, multi-weight version of the combined Resources ⮞ Fonts ⮞ Font Metrics, Resources ⮞ Fonts ⮞ True Weights, Resources ⮞ Fonts ⮞ Font Sets, and Resources ⮞ Fonts ⮞ Font Samples pages.

Note: the correct fonts will not appear when the operating system performs font substitution; for example, Helvetica and Times will not appear in Windows because Windows substitutes Arial for Helvetica and Times New Roman for Times.

Note: characters in tiny sizes will not appear in the proper sizes if the browser has been configured to set a minimum font size.

Subsections include:

Note: unlike most Browser News pages, this page is starkly plain, with minimal styling, partly to illustrate the points more clearly, but mainly to make it easier to compare browsers: viewing this page with several browsers and/or configurations at the same time makes the browsers’ basic differences clearer.

See also: other major pages in this site are Home, News, Find Browsers, Resources, Stats, and Store.

See also: other pages in this site which are closely related include Resources ⮞ Font Choices, Resources ⮞ Fonts ⮞ For Coding , Resources ⮞ Fonts ⮞ Ampersands (very, very slow), Resources ⮞ Fonts ⮞ Fluid Design & Sizes, Resources ⮞ Fonts, Resources ⮞ Font Choices, Resources ⮞ Fonts ⮞ Metrics (very slow page), Resources ⮞ Fonts ⮞ Samples (slow page), Resources ⮞ Fonts ⮞ Sets (slow page), Resources ⮞ Fonts ⮞ Possible Weights (slow page), Resources ⮞ Fonts ⮞ Richest Fonts (slow page), and Resources ⮞ Fonts ⮞ True Weights (very, very slow page).

List of Fonts 

This is a list of fonts for which you might also want details:

Font Metrics of the Font 

Like the table on the Resources ⮞ Fonts ⮞ Metrics page, the table below reports CapHgt, the height of capital letters, not counting descenders, Width, an average character width, Ex Size, the character ex size, Ex/Em, the ex/em ratio, and Ex/CapHgt, the Ex/CapHgt ratio, 𝓛 (a legibility factor), for both medium and small font sizes. Below the font name in the first column appears the CSS needed to select that font.

Note: font metrics for embedded fonts may be invalid — and will appear as blanks — if the fonts take too long to load, or if they fail to load; if this happens, refreshing the page may help. Font metrics may also be invalid for the Alegreya SC and Crimson Text fonts, probably due to defects in the font files.

Note: for fonts which aren’t embedded and whose font-stretch property can’t be normal, this can’t determine metrics for any font weight other than 400.

Note: if the font weights listed here don’t match what is listed in the font metrics table above, the font is likely an embedded font which took too long to load.

Samples of the Font In Medium Weight 

The samples consist of ASCII and Lorem Ipsum text in three font sizes, and two font styles.

More Samples of the Font, In All Its Weights 

Normally, sizes of samples are 2em, 1.5em, 1.2em, 1.00em, 0.89em, 0.75em, and 0.60em, which are the recommended xx-large, x-large, large, medium, small, x-small, and xx-small sizes in the proposed CSS4 standard.

You can view more samples — medium, small, x-small, xx-small, 16px, 15px, 14px, 13px, 12px, 11px, 10px, 9px, and 8px — by clicking See More Sizes, or revert to the default sizes by clicking See Default Sizes.

In all cases, the samples appear in both regular and italic faces.