问题
For some reason emoji do not render above a certain size in Chrome. This size seems unrelated to font-size or scale, it is just simply the pixel size of the emoji being rendered.
Since the images are not vectors, I can understand the reasoning behind not wanting them to be abnormally large, however since this only effects Chrome I am unsure.
Is this a Chrome bug, or something in the emoji standard that specifies a max intended size?
Here are two examples of non-rendering emoji:
- http://jsfiddle.net/e6zysLg7/7/
- http://jsfiddle.net/eyy6moLx/1/
回答1:
Is this a Chrome bug
Yes, it is. See, for example, these:
- bug report: https://bugs.chromium.org/p/chromium/issues/detail?id=719648
- bug report: https://bugs.chromium.org/p/chromium/issues/detail?id=501071
- test page: https://tobireif.com/posts/maximum_font_size_for_emoji/
Based on a lot of testing, 54px is the current maximum font size for emoji. But I will not give up hope :)
Update October 2018:
The maximum font-size for emoji in Mobile Chrome 69 is 146px.
Screenshot: https://app.crossbrowsertesting.com/public/ib8393c20a124bac/livetests/14400380/snapshots/z66ee2a9e2217b4cad00
If you set it to 147px, the emoji are not rendered properly: https://app.crossbrowsertesting.com/public/ib8393c20a124bac/livetests/14400384/snapshots/za103323111cb78aeff2
Some additional info regarding other mobile browsers: https://tobireif.com/posts/maximum_font_size_for_emoji/
回答2:
I just had the same problem, and I found out that the new max font size for emojis on Android devices is 49px, not 54px as Tobi Reif stated.
I guess this is changing with every new version.
回答3:
There is a bug reported in Chromium bug tracker - Color glyphs have a 256pt limit
We cache the "correct" version of color glyphs (as we do for alpha masks), but in both cases we have a size limit for the cache (i.e. 256pt).
In the case of non-color glyphs, we fall back on draw-as-path for larger sizes. We don't have such a fallback for color glyphs :(
In my Windows 10 system Chrome Version 69.0.3497.92 (Official Build) (64-bit), above font-size of 216px, the icon with color breaks.
Related issue: https://bugs.chromium.org/p/chromium/issues/detail?id=625191
来源：https://stackoverflow.com/questions/29142118/why-do-emoji-not-render-above-a-certain-size-in-chrome