Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Firefox Mac: some icons in Black and white Noto Emoji appear in colour

See original GitHub issue

Many icons in Noto Emoji black-and-white appear in colour when it is used as a webfont in Firefox. Safari and Chrome show b/w glyphs only, as expected. The colour glyphs are from the system Apple Color Emoji font. Firefox v100.0, MacOS 12.3.1.

<!DOCTYPE html>
<html>
<head>
<link href="https://fonts.googleapis.com/css2?family=Noto+Emoji&display=swap" rel="stylesheet">
</head>
<body style="font-family: Noto Emoji">
😀 😃 😄 😁 😆 😅 😂 🤣 😭 😉 😗 😙 😚 😘 🥰 😍 🤩 🥳 🙃 🙂 🥲 🥹 😋 😛 😝 😜 🤪 😇 😊 ☺️ …
</body>
</html>

Screenshot 2022-05-04 at 15 05 48

Issue Analytics

State:
Created a year ago
Comments:34 (13 by maintainers)

Top GitHub Comments

2reactions

jfkthamecommented, May 25, 2022

Screenshot of the Noto Emoji page in a Firefox build with added support for font-variant-emoji, and the text value added to the page (see the Inspector panel at the bottom):

1reaction

jfkthamecommented, May 25, 2022

Might be feasible, I’m not sure offhand how complex the implementation issues would be.

However, I think there’s another possible way forward: CSS Fonts defines a font-variant-emoji property which should allow the author to expressly ask for text-style or emoji-style presentation, overriding the defaults/heuristics that are currently happening.

I’m not sure any of the major browsers has implemented this property yet, but I think it’s the solution here and we should just get it done.

(In the case of Firefox, it’s https://bugzilla.mozilla.org/show_bug.cgi?id=1461589.)