Home » CSS » CSS font-weight Thin

CSS font-weight Thin

In CSS, to make the font-weight thin or lighter, you can use any value of 100, 200, or 300 or a lighter keyword for the CSS font-weight property. Following are the more details:

CSS font-weight Syntax

font-weight: numeric value;
/* or lighter keyword */
font-weight: lighter;

The value can be 100, 200, 300, or a lighter keyword. Below are the values are their description:

100Thin (Hairline)
200Extra Light (Ultra Light)

font-weight Thin Example

The below CSS code will make the text thinner for class light:

.light {
  font-weight: 100;

And in the below example, the paragraph text will be set to lighter:

p {
  font-weight: lighter;

Read Also: