WAIT: Font Variations Not Working on Windows

Browser: Chrome, FireFox - Latest
OS: Windows
URL: https://naqfexconsult.com/

Font variation settings aren’t working on Windows. On my Mac, the variation settings apply to my fonts without any issues, but on Windows, they don’t.

I’ve already tried: switching the CSS loading method between external and internal, and I’ve cleared and disabled the cache.

On this specific site, I’m using Google Fonts (Inter). I’m experiencing the same problem on another site under development where I’m using a custom font. I even tried enabling Google Fonts on that site, but the issue still exists.


What format are you writing it in?

I’ve found using this works fine for both:

%root% {
font-variation-settings: ‘wght’ 600;
}

So use single ’
And put a space before the number

Hi Emmanuelson,
Thanks so much for your report!

Unfortunately, I don’t know how to reproduce the problem. What I see in the front end is that you are using two fonts:

Inter for the body, Manrope for the headings.
For Manrope, you have set two font-variation settings: wght and wdth. However, according to google specs, there is no wdth axis for Manrope, only wght. This may be the cause of the problem. Remove wdth from the font variation settings and see if it works then.

Best regards,
timmse

You are absolutely right about this. I switched to a font which supports with wdth settings but only works in the builder. Please see video below:

At least macOS (left) and Windows (right) are now identical, which is a step in the right direction :smiley:

However, I still don’t know exactly what’s going on. Have you tested whether you also have the same problems in a “fresh” installation (without plugins/caching) with Bricks 2.0 alpha?