How do fonts react to font-weight when those are OS fonts?

Question

Do system UI fonts act the same way regarding font-weight ?

I tried this :

font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif

and this

@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500');
font-family: Roboto

On my ubuntu OS. The font weight didn't have the same impact on both font-family. When using font-weight: 500 with Roboto from google.fonts the text was bold. When using font-weight: 500 with the system ui fonts I had no bold.

So I'm wondering what's up ?

Answer 1

The numeric values for font-weight is 100-900.

Generally 400 is the same as normal and 700 for bold, though this is font specific.

In your case it appears as the font-weight of 500 for Roboto is defined as thicker than normal, hence the difference.

As a side note, not all fonts have a bold version.