desmeit
desmeit

Reputation: 650

Avoid to display Emoji with Unicode 1.1 (html)

I try to add an Emoji (♥) to my HTML Code and show it with Chrome.

<p>&#x2665;</p>

The heart is showing by the old Unicode Version 1.1 and because of that it is black:

enter image description here

How can i add the Emoji and show it in this new version?

enter image description here

Upvotes: 1

Views: 719

Answers (2)

roeland
roeland

Reputation: 5741

The code point for that emoji is U+2764 — HEAVY BLACK HEART. The ‘black’ refers to pre-emoji times, when this character was filled up (instead of only an outline).

You can append U+FE0F — VARIATION SELECTOR-16 to explicitly specify the colored version. U+FE0E will specify black/white:

  • U+2764: ❤
  • U+2764, U+FE0E: ❤︎
  • U+2764, U+FE0F: ❤️

The results are probably browser and system dependent, and dependent on what fonts are used. For me (Firefox / Windows 10) the first two above are black, while the third one is red.

Upvotes: 3

Davide Ungari
Davide Ungari

Reputation: 1960

Well I suppose it depends from the font you are using. You should find a webfont that is containing the emoji in the style you want and apply it to your page.

If you do not know web fonts take a look to https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Web_fonts

Upvotes: 0

Related Questions