😍 Emojis in HTML

😍 Emojis in HTML

Easily add emojis to your HTML files with a decimal or hex code

Did you know that emojis are standardized and approved by The Unicode Consortium? Tech companies must get standardized emojis approved by the organization in order to receive a unicode assignment.

These approved emojis can be used on web pages easily by adding an emoji’s decimal or hex code to your HTML files.

HTML Decimal Format: &#…;

HTML Hexadecimal Format: &#x…;

For example, both lines of code show the same emoji on a web page.

Note: The semicolon is required at the end of each code format.

Some Emojis to Try:

But are these accessible to website visitors using a screen reader?

Yes! Modern web browsers will attempt to read out each emoji. However, it’s also good practice to not rely entirely on an emoji to convey information. For example, don’t just use the ⚠️ alone. Add some text like: “⚠️ Important: Try to use emojis in context.”

Below are some ways devices/browsers read out “<p>&#128525;</p>”

Looking for more emojis to try out in HTML? You can use The Unicode Consortium’s online list, but beware that the page takes some time to load. Emojipedia is another great website to find hexadecimal codes for emojis — unicode is listed under the Technical Information tab for each emoji.

👉 Note: If you find a unicode for an emoji (U+1F640), simply remove the “U+” portion and use the hexadecimal in your HTML hexadecimal format (&#x1F640).