Recommendation for CSS font-weight matching

I am curious about your opinions or recommendations about this:

Given you have a font with 10 weights and want to align them somehow with the CSS font-weight properties. Those range from 100…900 in 100 -steps. So your font has one weight too many.

My current attempt is this

100 Thin
200 Extralight
300 light
400 Regular
500 Medium
600 Semibold
700 Bold
800 Extrabold
850 Black
900 Heavy

Is that a common and valid way to just squeeze in a a style at a 50-step value, as here with the Black weight? Or should Heavy just go to 1000 or are there other approaches?

A CSS font-weight value can be any integer from 1 to 1000.

1 Like

Thanks! So that 100-900 still seen all over the place seems outdated by now.

But: In Glyphs’ Instances > Weight Class there is still just that range offered (until 900). I am aware that those are not influencing the Axis Location, but when I put my Heavy on the weight location of 1000, I’d rather be able to put the weight class also to 1000. I mean, for a cleaner file, that makes sense also in the future when I come back to the project.

Those fixed weight class values are just for convenient access. You can also write a custom number in that field.

so just “1000” and nothing else? Happy to do so. Thanks a ton!

1 Like