The **font-weight property** is meant for setting the weight (boldness) of the font. The default `font-weight` is set as normal. Other values that can be used for `font-weight` are:

- **`bold`:** makes the text bold by setting its font-weight value to $400$.
- **Numerical values in the range of $100-900$:** These values represent the amount of weight we intend to assign to the text, where $900$ is the maximum weight.
- **`bolder/lighter`:** makes the font-weight one weight `bolder` or `lighter` than its current value.

# Implementation
The following code sets different a `font-weight` for each line of the text:

body {
  padding: 0 20px;
  font-family: 'Open Sans';
}

<html>
 <head>
 </head>
 <body>
 <link href='//fonts.googleapis.com/css?family=Open+Sans:100,400,600,700,800,300,900' rel='stylesheet' type='text/css'>
 <h2> Sample Heading </h2>
 This font has weight 100. 
 This font has weight normal (by-default). 
 This font has weight bolder than normal. 
 This font has weight bold. 
 This font has weight 900 
 </body>
</html>

codemirror

What is the font-weight property in CSS?

The font-weight property is meant for setting the weight (boldness) of the font. The default font-weight is set as normal. Other values that can be used for font-weight are:  bold: makes the text bold by setting its font-weight value to 400400400. Numerical values in the range of 100−900100-900100−900: These values represent the amount of weight we intend to assign to the text, where 900900900 is the maximum weight. bolder/lighter: makes the font-weight one weight bolder or lighter than its current value.  