Streaming live at 10am (PST)

Phantom font-weights in Chrome


#1

As far as I know, Varela Round has only one font weight: 400 - Normal. You can see this in the image below because the other options are greyed out.

However, if I am using the Chrome browser and I select 700 - Bold, the font weight somehow bolds and keeps the Varela Round font type. How is this possible and why does it also render bolded on my published site in Chrome but not Safari or Firefox?


Here is my site Read-Only: LINK
(how to share your site Read-Only link)


#2

I found an answer here: https://stackoverflow.com/questions/22891611/google-font-varela-round-doesnt-support-font-weight-in-chrome

This font is only available in font-weight: 400; and thus Google Chrome only supports this. This browser does not support another font-weight if it is not included.

So it sounds like Chrome applies synthetic (algorithmic) bolding to their fonts so if font-weight: 700 doesn’t exist for that Google font, it won’t render cross-browser.