3 ms·
What a fun hack! One small note: the post seems slightly confused about the use of OpenType features, as it calls for: font-feature-settings: "colr", "cal
by jfk13 2y ago
What a fun hack!
One small note: the post seems slightly confused about the use of OpenType features, as it calls for:
font-feature-settings: "colr", "calt";
but there's no 'colr' feature tag in the font's OpenType layout tables, so that's meaningless here.
I suppose this was intended to "activate" the color glyph table (COLR) in the font; but that isn't an OpenType layout feature that would be controlled by font-feature-settings, and doesn't need to be "turned on" like this.
(In addition, the 'calt' feature is (according to the spec[1]) supposed to be active by default, so it shouldn't be necessary to explicitly set it either. And indeed, the font works for me in both Firefox and Chrome without this rule; sadly Safari doesn't seem to handle it.)
[1] https://learn.microsoft.com/en-gb/typography/opentype/spec/features_ae#calt https://learn.microsoft.com/en-gb/typography/opentype/spec/f...
- deleted 2y ago[deleted]
- twiss 2y agoThe demo seems to work in Safari 17.3 on Browserstack even without the rule, what version are you using?
- jfk13 2y agoInteresting - thanks. I'm on 17.1; time to apply a macOS update, I guess.
- twiss 2y agoInterestingly it also seems to work fine on 16.5. Browserstack doesn't have 17.1, perhaps it was broken temporarily? Unless there's some other difference with the version of Browserstack somehow..
- torgoguys 2y agocaniuse reports that a regression bug broke it in Safari 17.0 and 17.1: https://caniuse.com/colr https://caniuse.com/colr