diff --git a/res/fonts/Twemoji_Mozilla/TwemojiMozilla-colr.woff2 b/res/fonts/Twemoji_Mozilla/TwemojiMozilla-colr.woff2 index 70f9b03c4d..593d7c8f5c 100644 Binary files a/res/fonts/Twemoji_Mozilla/TwemojiMozilla-colr.woff2 and b/res/fonts/Twemoji_Mozilla/TwemojiMozilla-colr.woff2 differ diff --git a/res/fonts/Twemoji_Mozilla/TwemojiMozilla-sbix.woff2 b/res/fonts/Twemoji_Mozilla/TwemojiMozilla-sbix.woff2 new file mode 100644 index 0000000000..277324851f Binary files /dev/null and b/res/fonts/Twemoji_Mozilla/TwemojiMozilla-sbix.woff2 differ diff --git a/src/utils/FontManager.js b/src/utils/FontManager.js index 796018a497..df11b76ae4 100644 --- a/src/utils/FontManager.js +++ b/src/utils/FontManager.js @@ -114,7 +114,13 @@ export async function fixupColorFonts() { // weights for the emoji to appear in bold messages, etc. document.fonts.add(new FontFace("Twemoji", path, { weight: 600 })); document.fonts.add(new FontFace("Twemoji", path, { weight: 700 })); + } else { + // fall back to SBIX, generated via https://github.com/matrix-org/twemoji-colr/tree/matthew/sbix + const path = `url('${require("../../res/fonts/Twemoji_Mozilla/TwemojiMozilla-sbix.woff2")}')`; + document.fonts.add(new FontFace("Twemoji", path, {})); + document.fonts.add(new FontFace("Twemoji", path, { weight: 600 })); + document.fonts.add(new FontFace("Twemoji", path, { weight: 700 })); } - // if not supported, the browser will fall back to one of the native fonts specified. + // ...and if SBIX is not supported, the browser will fall back to one of the native fonts specified. }