Таблица символов utf 8 для вставки иконок

Таблица символов utf 8 для вставки иконок

Здравствуйте, дорогие друзья!

Наверняка вы уже сталкивались с задачей вставить к себе на сайт символ стрелочки, конверта, телефонной трубки,  копирайта или какой-нибудь другой.

Для решения этой задачи можно воспользоваться одним из иконочных шрифтов, таких как Font Awesome, или же подготовить изображение нужного значка и вставить его на сайт. Однако можно пойти более простым путём. Для этого достаточно чтобы у вас перед глазами была таблица символов utf 8 или, как её ещё называют, таблица символов Unicode.

UTF8 на сегодняшний день является наиболее распространённой кодировкой символов. Именно на этой кодировке работает большинство сайтов, а так же движков (в том числе и WordPress).

Кроме того иконки из этой таблицы можно использовать для создания интересных ников на форумах, в социальных сетях или онлайн-играх.

Как это работает?

Смысл использования символов из таблицы UTF8 заключается в том, что у вас в компьютере уже есть все необходимые знаки и ваш браузер может с лёгкостью их отобразить, нужно только знать их специальный код.

Например, символ стрелочка вверх в UTF8 записывается так ↑

Вы можете скопировать эту последовательность знаков и вставить себе в HTML страницу как обычный текст.

После этого у вас на сайте вместо этого набора знаков появится графическое изображение стрелочки.  Удобно, не правда ли!?

И не нужно подключать никаких дополнительных шрифтов на ваш сайт ради вставки нескольких символов, а так же готовить и вставлять графические изображения.

Если вы создаёте свою HTML страницу в кодировке Windows-1251 или ещё какой-то другой то коды дынных символов не буду срабатывать, они отображаются только в кодировке UTF8.

Таблица символов UTF8 (Unicode) включает в себя тысячи, а то миллионы различных знаков.

Чтобы вам не приходилось пересматривать огромные таблицы в поисках нужного значка я выбрала наиболее интересные и полезные из них и разбила их по группам.

Символы стрелок в UTF8

Название Изображение Код в UTF8
Стрелка влево ←
Стрелка вправо →
Стрелка вверх ↑
Стрелка вниз ↓
Двойная стрелка в стороны ↔
Двойная стрелка вврех-вниз ↕
Стрелки влево-вправо ⇄
Стрелки вверх-вниз ⇅
Угловая вниз-влево ↲
Угловая вниз-вправо ↳
Угловая вверх-влево ↰
Угловая вверх-вправо ↱
Закруглённая влево ↶
Закруглённая вправо ↷
Круглая вверх-влево ↺
Круглая вверх-вправо ↻
Толстая стрелка вправо ➔
Стрелка зигзаг вниз ↯
Стрелка северо-запад ↖
Толстая юго-запад ➘
Толстая вправо ➙
Толстая северо-восток ➚
Пунктирная стрелка вправо ➟
Точечная стрелка влево ⇠
Угловатая стрелка вправо ➤
Светлая стрелка влево ⇦
Светлая стрелка вправо ⇨
Двойная стрелка влево « «
Двойная стрелка вправо » »
Треугольная стрелка вправо ►
Треугольная стрелка влево ◀
Треугольная стрелка вверх ▲
Треугоьная стрелка вниз ▼
Светлый треугольник вправо ▷
Светлый треугольник влево ◁
Светлый треугольник вверх △
Светый треугольник вниз ▽
Стрела лука ➴

 

Таблица иконок в Unicode

Название Изображение Код в UTF8
Тёмный телефон ☎
Светлый телефон ☏
Символ конверт ✉
Теефонная трубка ✆
Часы ⌚
Галочка в квадрате ☑
Символ галочка ✔
Символ крестик ✘
Светлая звезда ☆
Тёмная звезда ★
Четырёхконечная звезда ✦
Звезда в круге ✪
Светлое сердце ♡
Тёмное сердце ❤
Смайлик ☺
Восклицательный знак ⚠
Вторичное использоване ♻
Высокое напряжение ⚡
Чашка кофе ☕
Самолёт ✈
Песочные часы ⌛
Ножницы ✂
Корона ♕
Якорь ⚓
Крест ✝
Чёрно-белый круг ◑
Нота ♪
Двойная нота ♫
Карандаш ✎
Пишущая рука ✍
Женский знак ♀
Мужской знак ♂

Надеюсь что символов, представленных в этих таблицах будет для вас достаточно и вы сможете обходиться без подключения иконочных шрифтов и графических изображений для вставки нужных вам символов. Если данная статья была для вас полезной, не забудьте оставить комментарий. Спасибо что дочитали статью до конца!

Удачи вам в создании своих сайтов!

С уважением Юлия Гусарь

Подписаться на рассылку

Читайте также:

comments powered by HyperComments

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_bye.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_good.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_negative.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_scratch.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_wacko.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_yahoo.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_cool.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_heart.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_rose.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_smile.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_whistle3.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_yes.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_cry.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_mail.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_sad.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_unsure.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_wink.gif