Відображення іконок за допомогою веб-шрифтів є одним з найпопулярніших методів. Веб-шрифти мають багато переваг над використанням зображення на основі спрайтів. Ось кілька з них:
-
Ви легко можете змінити форму, розмір і колір за допомогою CSS;
-
Вони не бояться маштабування;
-
Ви можете змінити будь-який значок на ходу.
-
Економить багато часу, усуваючи традиційні задачі обробки зображення, такі як зміна прозорості, обертання та ін.
-
Вони прозорі за замовчуванням.
-
Працюють у старих браузерах, таких як IE6.
У цій статті зібрані деякі з кращих веб-шрифтів 2014 року.
Font Awesome
Font Awesome - один з найбільш популярних веб-шрифтів. З більш ніж 470 іконок, ви обов'язково знайдете потрібну вам. Він також надає анімовані за допомогою CSS спіннери "з коробки".
Weather Icons
Weather Icons \- це велика колекція зі 123 іконок. Шрифт орієнтований на погодні додатки.
Mono Social Icons Font
Mono Social Icons Font \- велика колекція з більш ніж 100 безкоштовних іконок. Іконки в трьох різних варіантах : круглі, прямокутні і стандартні.
Map Icons
Map Icons - 175 іконок для картографічних сервісів. Шрифт використовується з Google Maps і Google Places.
Github Octicons
Github Octicons \- іконки, які використовує GitHub для свого проекту.
Open Iconic
Open Iconic - набір з 223 іконкок, доступних в форматі SVG, webfont і растровому форматі. Також є спеціалізований CSS для таких популярних фреймворків, як Bootstrap і Foundation frameworks.
IcoMoon
IcoMoon - 450 безкоштовних іконок. Сервіс дозволяє вам завантажити іконки в різних векторних форматах: svg, pdf, eps, ai, psd. Також є платна версія.
The Entypo Pictogram Suite
Entypo - 250+ безкоштовних іконок. Є можливість завантажити іконки у наступних форматах: eps, pdf і psd.
Marka
Marka - великий набір іконок, які підтримують CSS- трансформації. Вони основані на чистому CSS і гарно працюють в сучасних браузерах. Зверніть увагу, що Марка - це не набір вбудованих іконок.
Payment webfont icons
**
Payment webfont icons надають великий набір з 34 іконкок популярних платіжних систем.
Ionicons
**
Ionicons \- це веб-шрифт для фреймворку Ionic. Але ви можете використовувати ці іконки у будь-якому веб-додатку.
Socialicious
**
Socialicious - іконки соціальних медіа у вигляді веб-шрифтів.
fontelico.font
**
fontelico.font - чудова колекція смайликів у вигляді веб-шрифтів.
OpenWeb Icons
**
OpenWeb Icons \- це набір іконок відкритих спільнот, стандартів або проектів. Він має 219 іконок в своїй колекції.
Brandico
Brandico \- це колективний збірник популярних брендових логотипів.
StateFace
StateFace - колекція іконок з різних штатів США.
JustVector Icons Font
JustVector - дуже популярна бібліотека іконок. Вони недавно випустила власний веб-шрифт, що складається з тих же наборів іконок, що й бібліотека.
Raphael Icon-Set
**
Raphael Icon-Set \- веб-версія раніше випущенного SVG шрифта. Він складається з піктограм, необхідних для кожному веб-додатку.
Sosa -- Ten by twenty
**
Sosa \- це ще одна популярна безкоштовна колекція з 160+ іконок.
Glyphicons
Glyphicons надає одні з кращих іконкових веб- шрифтів. Існує дві різні версії: безкоштовна (тільки png) і платна. Якщо ви використовуєте Bootstrap Framework, ви отримуєте спеціальну колекцію іконок від Glyphicons безкоштовно.
Я сподіваюся, що цей список буде корисним для ваших майбутніх проектів. Ви завжди можете занести цю сторінку в закладки для подальшого використання. Крім того, поділіться цим постом з вашими друзями, які були б зацікавлені у цьому списку.
Ще немає коментарів