Emojis blurry in Firefox compared to Edge on Windows11
I've found a solution to the blurriness of the emojis, I've put it in the end of this post, in bold ⤵⤵⤵
My problem is that emojis look bad on Firefox compared to Edge_128.0.2739.79. Two screenshots are attached of bing.com & a Google Doc (left half of both pictures is Edge, other half Firefox). The problem persists on all the sites to a varying degree.
Steps to replicate: A] Open 2 sites in latest Edge & Firefox on Windows 11 (the examples that I've used in the screenshots): https://www.bing.com/ and an Empty Google Doc. B] In the search field of bing and in a new line in an empty Google Doc, copy the following example emojis (That were inserted using the 'Windows_Key+V' which summons the emoji Keyboard of Windows): 🏀🚕 C] Compare the quality of the emojis rendering between the browsers when unzoomed and when zooming.
I've tried in FF (to no avail): A] Disable hardware acceleration in settings (w/ FF restart). B] Setting "gfx.font_rendering.cleartype_params.rendering_mode" from -5 to 5 (w/ 10+ FF restarts). C] Setting "gfx.webrender.quality.force-subpixel-aa-where-possible" to true (w/ FF restart). D] Using both emoji sets in the "Segoe UI Emoji" & "Twemoji Mozilla" fonts in the "font.name-list.emoji" setting, both sets gave me blurry results (w/ FF restarts). D] Disabling all add-ons (w/ FF restart). E] Setting new Firefox separate clean install. F*] In Windows setting the scaling factor to 100% in Windows->System->Display->Scaling_Factor (w/ FF & Windows restart).
How can the blurriness of the emojis be fixed so to make them crystal sharp like in Edge?
Solution: A} Download Noto-Color-Emoji font from https://fonts.google.com/noto/specimen/Noto+Color+Emoji Ensure that your are getting the full resolution font (which came at ~23MB as of 2024.09.23) B} Unpack the font and install according to the on screen instructions. C} In FF in "about:config" find the "font.name-list.emoji" setting and rewrite its value field to "Noto Color Emoji, Segoe UI Emoji, Twemoji Mozilla" (w/o the quotations marks). D} I've attached a screenshot w/ the result, It is marked w/ the red writing of font.name-list.emoji on it.
Modified
Chosen solution
Solution: A} Download Noto-Color-Emoji font from https://fonts.google.com/noto/specimen/Noto+Color+Emoji Ensure that your are getting the full resolution font (which came at ~23MB as of 2024.09.23) B} Unpack the font and install according to the on screen instructions. C} In FF in "about:config" find the "font.name-list.emoji" setting and rewrite its value field to "Noto Color Emoji, Segoe UI Emoji, Twemoji Mozilla" (w/o the quotations marks). D} I've attached a screenshot w/ the result, It is marked w/ the red writing of font.name-list.emoji on it.
Read this answer in context 👍 0All Replies (3)
Steps to replicate? Emoji are from where?
Steps to replicate: A] Open 2 sites in latest Edge & Firefox on Windows 11 (the examples that I've used in the screenshots): https://www.bing.com/ and an Empty Google Doc. B] In the search field of bing and in a new line in an empty Google Doc, copy the following example emojis (That were inserted using the 'Windows_Key+V' which summons the emoji Keyboard of Windows): 🏀🚕 C] Compare the quality of the emojis rendering between the browsers when unzoomed and when zooming.
Notes:
- In Firefox I've tried using both emoji sets in the "Segoe UI Emoji" & "Twemoji Mozilla" fonts in the "font.name-list.emoji" setting, both sets gave me blurry results.
- As far as I know all of the emojis I've tried look much better on edge (not just the 2 I've pasted above).
- The problem persists on all the sites to a varying degree.
- Also forgot to mention that I've tried to set the scaling factor to 100% in Windows->System->Display->Scaling_Factor and that didn't improve the emoji-rendering-quality in Firefox at all.
Modified
Seçilmiş Həll
Solution: A} Download Noto-Color-Emoji font from https://fonts.google.com/noto/specimen/Noto+Color+Emoji Ensure that your are getting the full resolution font (which came at ~23MB as of 2024.09.23) B} Unpack the font and install according to the on screen instructions. C} In FF in "about:config" find the "font.name-list.emoji" setting and rewrite its value field to "Noto Color Emoji, Segoe UI Emoji, Twemoji Mozilla" (w/o the quotations marks). D} I've attached a screenshot w/ the result, It is marked w/ the red writing of font.name-list.emoji on it.
Modified