Emoji Variation Selectors: Text Mode Versus Emoji Mode Explained
The black heart renders as an outline unless you add an invisible selector. Here is how U+FE0F and U+FE0E control emoji presentation. Some characters in Unicode have two faces: a plain text form and an emoji form. The black heart can render as a text outline or as a red emoji heart. The victory hand can render as a line drawing or as a colored emoji hand. Which one you get depends on a pair of invisible characters called variation selectors, and forgetting them is the most common reason an emoji renders wrong in HTML and email. Here is how the system works. I debugged this issue for a client who was sending emoji-rich email newsletters. About 30 percent of recipients saw the black heart as a text outline instead of a red emoji heart. The cause was that the email client was stripping the variation selector, causing the heart to fall back to its default text presentation. The fix was to ensure the variation selector survived the email rendering pipeline, which required changes to the email template and the encoding headers. The Two Variation Selectors Unicode defines two variation selector characters specifically for emoji presentation. U+FE0E is the text variation selector, which asks the renderer to show the text form. U+FE0F is the emoji variation selector, which asks for the emoji form. Both are zero width and invisible on their own. Read the full article on Emoji Reference, and copy any emoji mentioned from the catalog of 1303+ entries on the home page.