4 ms·

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 ht

by fooey 4y ago

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 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 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.

beart 4y ago
Hmm, I'm seeing the same thing.
CharlesW 4y ago
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 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 https://v-fonts.com/support
- runarberg 4y 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)
  - davelab6 4y ago
    It's Windows Firefox only
- fooey 4y ago
  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
  - tim-- 4y ago
    Chrome renders text differently to Firefox. Chrome uses Skia: https://www.chromium.org/developers/design-documents/graphics-and-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.
tux1968 4y ago
Thanks for mentioning this. I was confused by the seeming irrelevancy of all the sliders. Trying it on Chromium was illuminating.
Nullabillity 4y ago
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 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#type-tester 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.
- wildrhythms 4y ago
  It's a Windows Directwrite bug - https://twitter.com/googlefonts/status/1522775267852181504?s=20&t=mkkR5H9H6nb_CYDxVKJLEQ https://twitter.com/googlefonts/status/1522775267852181504?s...
  - Nullabillity 4y ago
    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.
- runarberg 4y ago
  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-italics-variable-font-support https://rwt.io/typography-tips/getting-bent-current-state-it...

by fooey 4y ago

beart 4y ago

Hmm, I'm seeing the same thing.

CharlesW 4y ago

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 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 https://v-fonts.com/support

runarberg 4y 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)
- davelab6 4y ago
  It's Windows Firefox only
fooey 4y ago
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
- tim-- 4y ago
  Chrome renders text differently to Firefox. Chrome uses Skia: https://www.chromium.org/developers/design-documents/graphics-and-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.

tux1968 4y ago

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

Nullabillity 4y ago

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 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#type-tester 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.

wildrhythms 4y ago
It's a Windows Directwrite bug - https://twitter.com/googlefonts/status/1522775267852181504?s=20&t=mkkR5H9H6nb_CYDxVKJLEQ https://twitter.com/googlefonts/status/1522775267852181504?s...
- Nullabillity 4y ago
  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.
runarberg 4y ago
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-italics-variable-font-support https://rwt.io/typography-tips/getting-bent-current-state-it...