How to change font weight with CSS
The font weight defines the thickness of your font. You can use this to highlight an important piece of text or change the style of headlines. Different fonts supports different styles so you may not be able to use all values on a specific font.
font-weight: bold;
This would make the font bold and apply a thicker style to the font. You can also use values like light and normal. If you need more control over the font weight you can use values from 100 to 900. The lower the value the lighter the font.
font-weight: 300;
This would be a quite light font whereas 900 would be to thickest available font style. If a font does not have all styles available 900 and 700 could output the same styling.
Written by: Michael from Beginnrtuts.com 07-09-2022 Written in: CSS tutorials
4 Comments
Leave a Reply
You must be logged in to post a comment.




Wow, this tutorial on changing font weight with CSS was so helpful! I’ve always struggled with adjusting the weight of my fonts, but this step-by-step guide made it super easy to follow . The explanations were clear, and the code examples were perfect for practice. I especially liked how the author provided different ways to change the font weight, catering to different preferences. Thanks to this tutorial, I feel much more confident in customizing my website’s typography now. Great job!
This tuturial was so helpful! I never realzied how easy it is to change font weights with CSS . Thank you for the clear explenation!
This tutorial was super helpful! I always struggled with changing font weights in CSS but now I feel so much more confident . Thank you for the clear and easy-to-follow explanation!
This tutorial was super helpful! I had no idea it was so easy to change font weight with CSS . Thank you for breaking it down step by step. Can’t wait to try it out on my website!