There are several issues at play here:
- The default system font is Deja Vu Sans, it contains the black and white emoji.
- The browser bundles its own emoji-specific font called
EmojiOneMozilla.ttf (originally bundled in Firefox, also included in the PureBrowser fork), it contains color emoji. (Sidenote: Due to licensing changes, recent versions of Firefox bundle
- You have also installed Noto Emoji, it contains newer color emoji in a different style. The scaling of this font is handled incorrectly by the version of Firefox that PureBrowser is forked from.
When an emoji character is encountered, the browser is picking between these three fonts to decide how to render them. The order above is the order of precedence, which happens to also be an order of increasing coverage, so older/common emoji are rendered in Deja Vu, more recent emoji in Emoji One, and cutting-edge emoji in badly-scaled Noto Emoji.
The "correct" solution is to fix the browser and/or Noto so that the scaling of Noto emoji in the browser is correct. Additionally, update the font hinting so that color emoji symbols are preferred over the system default font. Resolving these problems is non-trivial. For starters see:
In the meantime, one workaround is to replace
EmojiOneMozilla.tff with a color emoji font that scales correctly and has equal or better symbol coverage than Noto:
Now the Noto emoji symbols do not appear, because the Twemoji TTF has equal emoji coverage. If Noto coverage improves and your Noto package gets updated, the problem will recur for any new emoji symbols. At that point you will have to wait for a new Twemoji/eosrei release and reapply the workaround.
If your PureBrowser package gets updated, it may re-add EmojiOneMozilla.ttf, in which case you will have to delete it again. It may remove TwitterColorEmoji-SVGinOT.ttf, in which case you will have to re-add it.