Table of Contents

HTML Emojis

What are Emojis?

Emojis are the characters from UTF-8 character set that pretty much looks like images or an icons. The character set UTF-8 includes almost all characters and symbols. The UTF-8 is specified by using <meta> tag and a charset attribute. It is placed between the <head> elements.

Note:- UTF-8 is the default character set in HTML, if we not specify it we can still use the symbols.

How to Insert Emojis in HTML Document

There are three ways to insert an image in an HTML Document.

by using hexadecimal code
by using decimal code
copy and paste from external source

Using Hexadecimal Code:

We can add Emojis in an HTML document by specifying the hexadecimal code of a particular Emoji. The hexadecimal code must be placed between the <span> tags. These codes must start with &#x and end with ; (semicolon).

Here is how we can insert Emojis in an HTML document using Hexadecimal code:

<!DOCTYPE html>
<html>
<head>
  <meta charset = "UTF-8">
</head>
<body>
<p> This is an emoji <span>&#x1F609;</span>.</p>
</body
</html>

Copy the Code and Run it Here

Using Decimal Code

We can also add Emojis in an HTML document by specifying the decimal code of a particular Emoji. The Decimal code must be placed between the <span> tags. These codes start with &# and end with ; semicolon.

Here is how we can insert Emojis in an HTML document using Decimal code:

<!DOCTYPE html>
<html>
<head>
  <meta charset = "UTF-8">
</head>
<body>
<p> This is an emoji <span>&#128521;</span>.</p>
</body
</html>

Copy the Code and Run it Here

Copy and Paste from External Source

We can also copy Emojis from external source and paste them in an HTML Document. This is the most simple and easy way to add Emojis in HTML.

Summary

Emojis are the characters from UTF-8 character set that pretty much looks like images or an icons.
The UTF-8 is specified by using the <meta> tag and a charset attribute.
There are three ways to insert Emojis in an HTML Document. These are Hexadecimal Code, Decimal Code, Copy and paste from external sources.
However, the most preferred and simple way is copy paste.

Next

Related Posts

Semantic HTML Elements

HTML Computer Code

HTML Elements

HTML Emojis – crus4