font-weight

Writing the value

• A number from 1 to 1000; larger is bolder. It used to be nine steps of 100, but values in between such as 350 are now valid.
• normal equals 400 and bold equals 700. The initial value is normal.
• bolder and lighter depend on the parent's weight. With a parent at 400, bolder gives 700 and lighter gives 100; with a parent at 700, they give 900 and 400.

Only the weights the font has

When the font has no face at the requested weight, the closest available weight is used instead. When it has no bold face at all, the browser fakes one by thickening the strokes. A variable font can draw any value from 1 to 1000 exactly.

The preview on this page uses the operating system's font (system-ui), so how many distinct weights you can see depends on your OS.

Watch out

• h1 to h6 and strong are bold (bold or bolder) in the browser's default styles. Set a weight explicitly to make them lighter.
• The font shorthand resets an omitted font-weight to normal.