fontweight

Font weight refers to the thickness of the characters in a typeface. In web typography, the font-weight CSS property controls this thickness for text rendered with a given font. The property accepts the keywords normal, bold, lighter, and bolder, as well as numeric values from 100 to 900 in increments of 100. The numeric weights map to the weight axis defined by the font, but actual available weights vary by font face.

By default, font-weight is inherited from a parent element, and the initial value is normal (typically equivalent to 400). Bold usually corresponds to 700, but the exact rendering depends on the font.

Not all fonts provide every weight; if a requested weight is unavailable, browsers may synthesize a closer weight or simulate boldness. Therefore, the visible result can differ between fonts and platforms. The font-family chosen also affects what weights are available.

Common practice is to use exact weights for typographic emphasis or relative keywords (bolder, lighter) when the goal is adaptive sizing. When using numeric values, 100-300 give hairline to light weights, 400 normal, 500-600 medium to semi-bold, and 700-900 bold to extra-bold weights.

To apply weight in CSS, specify font-weight with a value such as font-weight: 600; or font-weight: bold; as needed. Consider accessibility and readability when selecting weights, ensuring adequate contrast and legibility across devices.