Font Weight

The weight of the letters (font-weight) is set by the classes font- followed by the name of a weight. You know font-bold; here are all of them:

The ones you'll use most are font-normal for ordinary text, font-medium and font-semibold for text that should stand out a little, and font-bold or font-extrabold for headings. As you know from the CSS course, a font only looks different in the weights it really has. Tailwind uses the system font of the device (for example Segoe UI on Windows and San Francisco on a Mac), which has many weights, so you'll usually see the difference.

We'll make the name even bolder and give the small text of the badge a little more weight, so that it's crisp. Just like with sizes, replace font-bold, don't add a second weight.