Іконкові веб-шрифти

3 хв. читання

Відображення іконок за допомогою веб-шрифтів є одним з найпопулярніших методів. Веб-шрифти мають багато переваг над використанням зображення на основі спрайтів. Ось кілька з них:

  • Ви легко можете змінити форму, розмір і колір за допомогою 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 безкоштовно.

Я сподіваюся, що цей список буде корисним для ваших майбутніх проектів. Ви завжди можете занести цю сторінку в закладки для подальшого використання. Крім того, поділіться цим постом з вашими друзями, які були б зацікавлені у цьому списку.

Помітили помилку? Повідомте автору, для цього достатньо виділити текст з помилкою та натиснути Ctrl+Enter
Codeguida 5.9K
Приєднався: 8 місяців тому
Коментарі (0)

    Ще немає коментарів

Щоб залишити коментар необхідно авторизуватися.

Вхід / Реєстрація