diff --git a/res/fonts/Twemoji_Mozilla/TwemojiMozilla-colr.woff2 b/res/fonts/Twemoji_Mozilla/TwemojiMozilla-colr.woff2 index 70f9b03c4d1..593d7c8f5c8 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 00000000000..277324851fd 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 796018a4977..df11b76ae4f 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. }