Inconsistent Unicode Emoji Glyphs/Symbols

Question

I've been trying to make use of the Unicode symbols for astrology in products for both Apple and iOS. I'm getting inconsistent results, as shown here:

Most of these are coming out as I like, but for some reason the Taurus symbol is appearing one way on the first line, following the Moon, and a very different way, with the Emoji-like purple button, when it follows Mars. These results are consistent for different symbols and across Apple hardware; here's a screen capture from my phone showing the same problem with some other signs - Scorpio comes out all right, but Libra and Cancer are buttons.

The strings are extremely straightforward; "Moon Taurus" in the first image is \u263D for Moon, \u2649 for Taurus, basically assembled as [NSString stringWithFormat:@"%@%@", @"\u263D", @"\u2649"]. The "Mars Taurus" image is the same, only with \u2642 for Mars. The string formatting is identical in the different cells of the OSX table, and in the iOS AttributedString.

Any idea what makes these symbols appear one way sometimes, and another way other times?

Cuirassier

Answer 1

Unicode uses variation sequences to select between different renderings for certain code points—listed in the StandardizedVariants.txt file. In your case, the astrological symbols have both "text style" and "emoji style" variants that are selected between by a U+FEOE (text style) or U+FE0F (emoji style) following the code point:

U+2650 U+FE0E: ♐︎

U+2650 U+FE0F: ♐️

Note that correct interpretation of the variation selector depends on support from both the application/framework and the fonts being used. On Chrome (42) there doesn't appear to be any difference between my examples above, but on Safari (8) they are distinct.

Jackinthebox

Thank you, that rocks. And works. Pity that Chrome doesn't respect it, but most importantly my iOS and OSX apps do. – Cuirassier

Wpf apps also don't respect this. – Barometrograph

Works on Chrome 77.0.3865.90 on Win 10 Enterprise. – Careycarfare

absolutely nuts that we have no control over this in Chrome. Those look the same to me. Very frustrating. For my purposes, I'd like to be able to color the symbol in a Google Slides presentation and it's impossible with these emojis. – Sachikosachs

If you want to force an emoji in web applications, you must write down the unicode emoji markers like ️ without a separating space, as in ☎️. – Oculus