Using Virtual Master with Variable Font results in font not displaying in Webkit browsers


I’m currently experimenting with optical sizing for an icon font (with Glyphs 2.6.1). Because optical sizing is most important for just a couple icons, I’ve tried using Virtual Master. It appears to work in Firefox, but Chrome and Safari both refuse to render the icons that have optical size set on them with CSS.

Any icon without these axes set still works.

Edit: Taking font-variation-settings below 100 (the minimum for the axis) for optical size renders the icons as optical size 100. But going back up to 100 causes them to fail to render again. Going above 200 (the axis max) doesn’t trigger a successful render.

Edit 2 This is in Chrome 73.0.3683.75 and Safari 12.0.3.


There are several problems with the optical size axis in Safari. Variable font optical size issue


Thanks for taking a crack at patching it up yourself, Georg. I can think of four possibilities (you’re the expert though).

  • my font doing scheisty and unsupported things for
  • a bug in the variable font generation in Glyphs

I believe the same problem is preset with a true multiple master setup (even with Enforce Master Compatibility on)

  • a bug in webkit’s handling of variable fonts

I don’t think I’ve ever cut a ticket to Webkit that was resolved. Maybe you’ve had better luck.

  • webkit being stricter about rendering than firefox, illustrator, and font view.