: How to use unicodes effectively on cross-platform sites? I was trying to use the 'ELECTRIC LIGHT BULB (U+1F4A1)' unicode on my site. Every platform shows the unicode different, even though I
I was trying to use the 'ELECTRIC LIGHT BULB (U+1F4A1)' unicode on my site. Every platform shows the unicode different, even though I specify Symbola font on the font-family on the body tag (all characters use this font except for unicodes).
Linux: Symbola font
Windows: Segio UI font
Android: emoji
Now this might not look like a problem because every platform shows the right icon. It is a problem when you try to change the color, which is something I expect from a character, does not work with emoji.
Also the characters showing different on every platform in general is kind of annoying.
How can I use unicodes effectively, avoiding differences across platforms?
More posts by @Hamm4606531
1 Comments
Sorted by latest first Latest Oldest Best
The only way to make an unicode icon display across browsers consistently is by loading the icon's default webfont. For example, the electric light bulb unicode character uses the Symbola font. If that isn't installed on the device, the device will then use the fall-back of the fonts you listed.
For a cross-platform solution, you'll need to use font icons like Font Awesome. It's also pretty easy to create your own font icons with Icomoon. That or you'll need to load each icons webfont which isn't at all practical.
Terms of Use Create Support ticket Your support tickets Stock Market News! © vmapp.org2024 All Rights reserved.