I’ve had this problem recently, I chose a wonderful thin font for a web design, but when I included it using @font-face it looked all bold and ugly (which is a bit annoying for a thin font).

I found the solution on CSS Tricks, you just need to use font-weight:400; every time you use the font with font-family. If you want to understand the whys and hows, just head over to Chris Coyer’s article that goes in-depth.

About the Author

author photo

Mirko Humbert

Mirko Humbert is the editor-in-chief and main author of Designer Daily and Typography Daily. He is also a graphic designer and the founder of WP Expert.