Вставить эмоджи в html

Smiley Emoji

If you want any of these emojis displayed in HTML, you can use the decimal (dec) or hexadecimal (hex) reference found in the table below.

Example

Will display as:

Char	Dec	Hex	Entity	Name
😀	128512	1F600	GRINNING FACE
😁	128513	1F601	GRINNING FACE WITH SMILING EYES
😂	128514	1F602	FACE WITH TEARS OF JOY
😃	128515	1F603	SMILING FACE WITH OPEN MOUTH
😄	128516	1F604	SMILING FACE WITH OPEN MOUTH AND SMILING EYES
😅	128517	1F605	SMILING FACE WITH OPEN MOUTH AND COLD SWEAT
😆	128518	1F606	SMILING FACE WITH OPEN MOUTH AND TIGHTLY-CLOSED EYES
😇	128519	1F607	SMILING FACE WITH HALO
😈	128520	1F608	SMILING FACE WITH HORNS
😉	128521	1F609	WINKING FACE
😊	128522	1F60A	SMILING FACE WITH SMILING EYES
😋	128523	1F60B	FACE SAVOURING DELICIOUS FOOD
😌	128524	1F60C	RELIEVED FACE
😍	128525	1F60D	SMILING FACE WITH HEART-SHAPED EYES
😎	128526	1F60E	SMILING FACE WITH SUNGLASSES
😏	128527	1F60F	SMIRKING FACE
😐	128528	1F610	NEUTRAL FACE
😑	128529	1F611	EXPRESSIONLESS FACE
😒	128530	1F612	UNAMUSED FACE
😓	128531	1F613	FACE WITH COLD SWEAT
😔	128532	1F614	PENSIVE FACE
😕	128533	1F615	CONFUSED FACE
😖	128534	1F616	CONFOUNDED FACE
😗	128535	1F617	KISSING FACE
😘	128536	1F618	FACE THROWING A KISS
😙	128537	1F619	KISSING FACE WITH SMILING EYES
😚	128538	1F61A	KISSING FACE WITH CLOSED EYES
😛	128539	1F61B	FACE WITH STUCK-OUT TONGUE
😜	128540	1F61C	FACE WITH STUCK-OUT TONGUE AND WINKING EYE
😝	128541	1F61D	FACE WITH STUCK-OUT TONGUE AND TIGHTLY-CLOSED EYES
😞	128542	1F61E	DISAPPOINTED FACE
😟	128543	1F61F	WORRIED FACE
😠	128544	1F620	ANGRY FACE
😡	128545	1F621	POUTING FACE
😢	128546	1F622	CRYING FACE
😣	128547	1F623	PERSEVERING FACE
😤	128548	1F624	FACE WITH LOOK OF TRIUMPH
😥	128549	1F625	DISAPPOINTED BUT RELIEVED FACE
😦	128550	1F626	FROWNING FACE WITH OPEN MOUTH
😧	128551	1F627	ANGUISHED FACE
😨	128552	1F628	FEARFUL FACE
😩	128553	1F629	WEARY FACE
😪	128554	1F62A	SLEEPY FACE
😫	128555	1F62B	TIRED FACE
😬	128556	1F62C	GRIMACING FACE
😭	128557	1F62D	LOUDLY CRYING FACE
😮	128558	1F62E	FACE WITH OPEN MOUTH
😯	128559	1F62F	HUSHED FACE
😰	128560	1F630	FACE WITH OPEN MOUTH AND COLD SWEAT
😱	128561	1F631	FACE SCREAMING IN FEAR
😲	128562	1F632	ASTONISHED FACE
😳	128563	1F633	FLUSHED FACE
😴	128564	1F634	SLEEPING FACE
😵	128565	1F635	DIZZY FACE
😶	128566	1F636	FACE WITHOUT MOUTH
😷	128567	1F637	FACE WITH MEDICAL MASK
🙁	128577	1F641
🙂	128578	1F642
🙃	128579	1F643
🙄	128580	1F644
🤐	129296	1F910
🤑	129297	1F911
🤒	129298	1F912
🤓	129299	1F913
🤔	129300	1F914
🤕	129301	1F915
🤠	129312	1F920
🤡	129313	1F921
🤢	129314	1F922
🤣	129315	1F923
🤤	129316	1F924
🤥	129317	1F925
🤧	129319	1F927
🤨	129320	1F928
🤩	129321	1F929
🤪	129322	1F92A
🤫	129323	1F92B
🤬	129324	1F92C
🤭	129325	1F92D
🤮	129326	1F92E
🤯	129327	1F92F
🧐	129488	1F9D0

Источник

Using Emojis in HTML

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 tag:

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):

Example

I will display A B C

I will display A B C

Example Explained

The 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:

Example

My First Emoji

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

Example

Sized Emojis

Some Emoji Symbols in UTF-8

For a full list, please go to our HTML Emoji Reference.

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

Использование эмодзи в HTML

Эмодзи (смайлы) выглядят как изображения или значки, но на самом деле это не так. Это буквы (символы) из набора символов UTF-8 (Unicode).

HTML атрибут charset

Чтобы правильно отображать HTML-страницу, веб-браузер должен знать набор символов, используемый на странице. Это указано в теге :

Набор символов UTF-8

Пример

Я буду отображать A B C

Я буду отображать A B C

Объяснение примера

Элемент определяет набор символов.

Символы A, B и C отображаются числами 65, 66 и 67.

Чтобы браузер понял, что вы показываете символ, вы должны начинать номер объекта с &# и заканчивать его с ; (точка с запятой).

Эмодзи символы

Эмодзи — это также символы алфавита UTF-8:

Пример

Мой первый эмодзи

Поскольку эмодзи являются символами, их можно копировать, отображать и изменять размер, как и любой другой символ в HTML.

Пример

Размер эмодзи

Некоторые символы эмодзи в UTF-8

ПАЛИТРА ЦВЕТОВ

ПРИСОЕДИНЯЙТЕСЬ!

Получите ваш
Сертификат сегодня!

Связь с админом

Если вы хотите сообщить об ошибке, а также внести предложение о работе сайта, добавить объявление или рекламу на сайт, не стесняйтесь отправить админу электронное письмо на email:

Топ Учебники

Топ Справочники

Топ Примеры

Веб Сертификаты

Этот сайт оптимизирован для обучения и тестирования. Примеры могут быть упрощены для улучшения чтения и базового понимания. Учебные пособия, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность и работоспособность всего контента. Используя этот сайт, вы соглашаетесь с тем, что прочитали и приняли условия использования, cookie и политику конфиденциальности.
Также вы можете абсолютно бесплатно скачать офлайн версию сайта W3Schools на русском архивом с GitHub и пользоваться локально на своём компьютере.
Также доступна версия сайта W3Schools на украинском языке.
Copyright 1999-2021 by Refsnes Data. All Rights Reserved.
Сайт работает на фреймворке W3.CSS.

Источник

How to Use Emojis in HTML

Emojis are the characters that belong to the default character set(UTF-8) of HTML. The character set (UTF-8) contains a huge list of characters that may not be typed using the keyboard so as the emojis. The emojis have decimal numbers and HEX values that may be used to represent them in HTML. This article provides a list of widely used emojis and their usage in HTML.

How to use Emojis in HTML

The emojis can be added either by just a copy/paste phenomenon or using the HEX code of the emoji.

Method 1: Copy the emoji and paste it into the code editor

This method copies the emoji and pastes it into the editor. The example written below practices this method:

The above code contains two paragraphs that contain six emojis. We have set the font style of the paragraphs to 25px (to get an enlarged emoji).

From the output, it is observed that the emojis were copied into the editor and shown in the output.

Method 2: Using the HEX code and decimal value

The decimal value and HEX values of emojis can be used to get them on the web page. Before getting into an example, let’s have a look at the table that shows the emojis with their HEX and decimal values.

Note: You can get the HEX code of all emojis from unicode.org. You will find that code is written in a form like U+1F63A and to make use of it, you must remove the U+ from the HEX value and use the other part of the HEX code.

Example
The example provided below shows the usage of several emojis using HEX code and decimal values.

A paragraph is created that uses decimal values and HEX values of emojis to use them in HTML.

The output represents that the HEX code and decimal values are converted to their associated emojis.

How to use various skin tones of emojis in HTML

Various emojis can have multiple displays and are referred to as the skin tone of that emoji. The skin tones may vary from dark followed by medium, and light. These skin tones can be added with emojis using the following decimal values.

Skin Tone	Decimal Value
Light	🏻
Medium-Light	🏼
Medium	🏽
Medium-Dark	🏾
Dark	🏿

Example
The skin tone can be added to any emoji by appending the decimal value of skin tone to the decimal/HEX value of that emoji. We have executed the following code in this regard:

The five paragraphs can be seen in the above code and each paragraph uses a different skin-tone for the victory(✌) emoji.

The output displays the light, medium-light, medium, medium-dark, and dark skin tones of an emoji(✌).

Conclusion

The Emojis can be added to the HTML document in two ways, either copy and paste the emoji or use the HEX/decimal values. This post demonstrates these methods to use emojis in HTML. The copy/paste method allows you to copy the emoji and paste it into the code editor. The HEX code can be generated from the Unicode of the emojis that can be obtained from unicode.org. The copy/paste method is easy to follow, however, it is recommended to use either Hex value or decimal value to use emojis in HTML.

Источник