Page 1 of 1

Using Emojis in HTML

Posted: Fri Oct 27, 2023 8:05 am
by Guest
Using Emojis in HTML


Emojis are characters from the UTF-8 character set: ๐Ÿ˜„ ๐Ÿ˜ ๐Ÿ’—




Emoji
Value


๐Ÿ—ป๐Ÿ—ปTry it ยป๐Ÿ—ผ๐Ÿ—ผTry it ยป๐Ÿ—ฝ๐Ÿ—ฝTry it ยป๐Ÿ—พ๐Ÿ—พTry it ยป๐Ÿ—ฟ๐Ÿ—ฟTry it ยป๐Ÿ˜€๐Ÿ˜€Try it ยป๐Ÿ˜๐Ÿ˜Try it ยป๐Ÿ˜‚๐Ÿ˜‚Try it ยป๐Ÿ˜ƒ๐Ÿ˜ƒTry it ยป๐Ÿ˜„๐Ÿ˜„Try it ยป๐Ÿ˜…๐Ÿ˜…Try it ยป


Full HTML Emoji Reference

HTML Emojis Examples


๐Ÿš€๐Ÿš๐Ÿš‚๐Ÿšƒ๐Ÿš„


HTML Emoji Transport Symbols


๐Ÿ’บ๐Ÿ’ป๐Ÿ’ผ๐Ÿ’ฝ๐Ÿ’พ


HTML Emoji Office Symbols


๐Ÿ‘ฎ๐Ÿ‘ฏ๐Ÿ‘ฐ๐Ÿ‘ฑ๐Ÿ‘ฒ


HTML Emoji People Symbols


๐Ÿ‚๐Ÿƒ๐Ÿ„๐Ÿ…๐Ÿ†


HTML Emoji Animals Symbols

What are Emojis?
Emojis look like images, or icons, but they are not.
They are letters (characters) from the UTF-8 (Unicode) character set.

UTF-8 covers almost all of the characters and symbols in the world.


The HTML charset Attribute
To display an HTML page correctly, a web browser must know the character set used in the page.
This is specified in the <meta> tag:


<meta charset="UTF-8">



If not specified, UTF-8 is the default character set in HTML.


UTF-8 Characters
Many UTF-8 characters cannot be typed on a keyboard,
but they can always be displayed using numbers (called entity numbers):

A is 65
B is 66
C is 67


Example

<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<body>
<p>I will display A B C</p>
<p>I will display A B C</p>
</body>
</html>

Try it Yourself ยป

Example Explained
The <meta charset="UTF-8"> element defines the character set.
The characters A, B, and C, are displayed by the numbers 65, 66, and 67.
To let the browser understand that you are displaying a character, you must start the entity number
with &# and end it with ; (semicolon).







Emoji Characters
Emojis are also characters from the UTF-8 alphabet:

๐Ÿ˜„ is 128516
๐Ÿ˜ is 128525
๐Ÿ’— is 128151


Example

<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<body>
<h1>My First Emoji</h1>
<p>๐Ÿ˜€</p>
</body></html>

Try it Yourself ยป

Since Emojis are characters, they can be copied, displayed,
and sized just like any other character in HTML.

Example

<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<body>
<h1>Sized Emojis</h1>
<p style="font-size:48px">๐Ÿ˜€ ๐Ÿ˜„ ๐Ÿ˜ ๐Ÿ’—</p>
</body></html>

Try it Yourself ยป













โ˜…
+1

Reference: https://www.w3schools.com/html/html_emojis.asp