Hacker News Reader

Comment by fooey | Hacker News Reader

Since the only thing that even renders in Firefox is Normal 400, something somewhere maybe could have used some more testing

https://i.imgur.com/dPrjDZZ.png

edit:

@googlefonts says they do not currently support Variable Fonts for Windows Firefox users

https://twitter.com/googlefonts/status/1522775267852181504

> Currently our API doesn't serve any VFs to Windows Firefox users due to a bug in windows DirectWrite mishandling the MVAR table. We are investigating what % of API Windows Firefox users now experience the bug, as it has been fixed in newer versions of Windows 10.

View on HN

This seems to be an issue with the Google Fonts API, not Firefox itself.

For me (Firefox 100, Arch Linux) all the options work fine on https://v-fonts.com/fonts/roboto-flex (all of them have _some_ effect, have smooth transitions, and look roughly the same as in Chromium), but on https://fonts.google.com/specimen/Roboto+Flex?query=roboto#t... the only option that does anything is Weight, and that one only snaps into one of three broad categories.

It's a Windows Directwrite bug - https://twitter.com/googlefonts/status/1522775267852181504?s...

No, it's a GFonts bug that they're overly eager to work around a DW bug, even if the system doesn't even have DW installed.

I recently incorporated a variable font into a web app at $WORK (as in less then 6 months ago). And I remember seeing some issues like that Using google hosted variable fonts just didn’t seem to work in firefox. There was something about defining the range in the @font-face rule which google font omits (or does differently), or how variable fonts are consumed (font-weight vs font-variation-settings).

My conclusion was—if my memory is accurate—that there was no way we could use google hosted fonts (you should always self host your fonts anyway if you can) and you needed split files for italics (the italic axis simply doesn’t work consistently across browsers).

EDIT: Here is an article describing the current state of the italics axis in browsers: https://rwt.io/typography-tips/getting-bent-current-state-it...

Roboto Flex appears to work correctly in Firefox 100 on macOS.

caniuse reports that Firefox has supported variable fonts since 2018: https://caniuse.com/variable-fonts

EDIT: Firefox's variable fonts support depends on OS support, and so requires at least Windows 10 or macOS 10.13 on the desktop. Apparently, variable fonts support on Linux is "complicated". https://v-fonts.com/support

I'm on Windows 11 and only Normal 400 is working in Firefox 100 Stable, Firefox 101.0b3 Developer Edition, Tor 11.0.10 (FF 91.8.0esr), and Tor 11.0.11 (FF 91.9.0esr)

It does work in both Chrome and Edge, so I don't think it's a general OS issue

Chrome renders text differently to Firefox. Chrome uses Skia: https://www.chromium.org/developers/design-documents/graphic...

Firefox uses the Windows DirectWrite APIs. This means that Firefox leans into the support that Windows has for variable fonts, and that was dicey until a few releases ago.

I’m on Ubuntu 21.10 and I know firefox supports at least the weight, slant, condense and italic axis (although there is some weird interoperability issues between the three browsers on how the italic axis)

It's Windows Firefox only

Thanks for mentioning this. I was confused by the seeming irrelevancy of all the sliders. Trying it on Chromium was illuminating.

Hmm, I'm seeing the same thing.

Reply on news.ycombinator.com