Font weight

Font weight refers to the thickness or density of a typeface’s strokes. By adjusting font weight, you can improve the legibility of text, highlight critical information, and create a visual hierarchy on a web page or application. 

In CSS, the font-weight property specifies the weight, or thickness, of a font. Values range from 100 (thin) to 900 (bold), with regular weight typically set at 400 and bold at 700. For example, the following CSS code snippet sets the font weight of all text in the body of a webpage to bold:

body { font-weight: bold; }

In HTML, inline styles or linked CSS files define font weight. For example, the following inline style snippet sets the font weight for “this text is extra bold” to 700. 

<p style="font-weight: 700;">This text is extra bold.</p>

Visit Webflow University to learn more about using different font weights with variable fonts.

A new way to learn and to build for the web

Get the best, coolest, and latest in design and no-code delivered to your inbox each week.

Shoot, something didn't work. Try again later, bud.