Font weight

Font weight describes how light or heavy the strokes of a font appear.

See real examples ↓
Illustration in Geist

What it means

Weight is one way to separate a heading, a paragraph and a small label without changing families. Numeric CSS values identify weights, but the same number does not promise the same visual darkness in two different typefaces. A bold style may also adjust spacing and proportions rather than simply thicken every outline.

Use it in practice

Compare weights at their intended size. Use stronger text for meaningful emphasis and keep paragraphs comfortable to read.

Watch out for

Do not use a very light weight for essential small text. Check that the actual font resource contains the weight you request.

From the collection

The demonstration compares regular and semibold Geist. The credited websites below show how weight choices fit into broader compositions.