Шрифт иконки для сайта: Font Awesome — иконочный шрифт и CSS-инструментарий

21.05.2021 Разное

Содержание

10 лучших бесплатных шрифтов иконок (Icon Fonts) для веб-дизайнеров

Главная » Статьи » 10 лучших бесплатных шрифтов иконок (Icon Fonts) для веб-дизайнеров

Icon Fonts — это шрифты, которые вместо букв прописывают специальные символы в виде иконок. И их вы можете использовать при создании потрясающего дизайна вашего WordPress сайта без умения рисовать в векторе.

Главным достоинством такого подхода является то, что вам просто нужно установить один из этих шрифтов и вы уже можете пользоваться бесплатным набором качественных svg иконок на своем сайте. То есть, как дизайнер вы получаете симпатичные графические значки, которые выполнены в одном определенном стиле и отлично масштабируются при любых увеличениях. А со стороны разработчика — вам просто нужно скачать и добавить в свой WordPress сайт новые шрифт.

Думаем, вы уже поняли суть удобства использования Icon Fonts.

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

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

1. Font Awesome

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

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

Каждый значок полностью масштабируется и поддерживается непосредственно в CSS. Поэтому, вы можете менять цвета, тени, фоновые градиенты и многое другое, используя чистый CSS3. Скачать этот шрифт можно на GitHub.

2. Octicons

Не так давно GitHub открыл свой собственный набор значков под названием Octicons. Этот бесплатный набор в настоящее время находится в версии 8.1.0 и включает в себя множество качественных значков с некоторыми основными символами.

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

3. Captain Icon

Коллекция значков, созданная дизайнером Mario del Valle. Captain Icon — это совершенно бесплатный проект с открытым исходным кодом, размещенный на GitHub с векторными файлами и веб-шрифтами.

То, что привлекает особое внимание разработчиков к этому пакету значков, — это их стиль. Тут каждый значок имеет очень уникальный дизайн, и все они были нарисованы с нуля. Этот рисованный стиль, заставляет их выделяться среди других более строгих наборов иконок.

Но, их уникальность не всегда подойдет к общему дизайну сайта. Поэтому данный шрифт лучше всего использовать на творческих сайтах, где стиль ручной прорисовки будет соответствует макету.

4. Zondicons

К сожалению, шрифт Zondicons не размещен на GitHub, поэтому у него нет истории обновлений. А основная ссылка для скачивания шрифта поступает прямо с официального веб-сайта, поэтому трудно сказать, были ли они когда-либо обновлены вообще.

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

5. Typicons

С закругленными углами и более простыми контурами набор иконок

Typicons идеально подходит для любого современного сайта. Набор поставляется с 330+ уникальными значками, но общим стилем.

Пакет полностью бесплатный и также доступен на GitHub. А еще, он может служить для iOS разработок, но с некоторыми незначительными настройками и специальными фрагментами кода.

6. Entypo

Это превосходные значки Entypo существует уже несколько лет. И за это время они хорошо себя показали среди своих конкурентов приятным и универсальным дизайном.

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

Entypo поставляется с более чем 400 значками и лицензией CC sharealike. А так же, вы можете найти их на GitHub.

7. MFG Labs

MFG Labs

— это довольно таки новый шрифт в этом списке старичков, который так же имеет свой собственный набор иконок.

Каждый значок шрифта заполняется стандартными форматами webfont с использованием Unicode PUAs в CSS. Поэтому, MFG Labs является полностью отзывчивым решением для всех браузеров.

8. Ionicons

Ionicons также являются абсолютно бесплатным шрифтом, который доступен на GitHub.

Для новичков, которые раньше не использовали значки в своей работе, это просто потрясающее решение. Так как, они очень просты в настройке и не требуют особых усилий в их использовании.

9. Devicons

Пакет Devicons это еще один вариант веб-шрифтов, которые вы можете использовать у себя, но уже для отображения не иконок, а технических логотипов или логотипов известных брендов. Что бывает очень полезным для создания, например, порталов или блогов ИТ направления.

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

10. Material Design Icons

Уже давно всем известно, что компания Google ввела новое направление в дизайне — «Material design». А это, в свою очередь, привело к появлению множества новых фреймворков и дополнений, включая пакет шрифтов иконок Material Design Icons.

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

Завершение

Очень трудно было выбрать среди множества достойных решений самые лучшие. Но, как мы считаем, именно на эти варианты нужно обратить внимание в первую очередь. А если вы на своих проектах пользуетесь каким-то другим набором и вы считаете его более достойным — напишите нам про это в комментариях. И, возможно, мы сделаем более обширный список в будущем.

Иконочные шрифты или SVG — что выбрать в 2018? – База знаний Timeweb Community

Графические иконки — ключевой элемент практически любого сайта или приложения. Как правило, весят они немного, однако вопрос выбора формата все равно остается актуальным. Если не брать в расчет стандартные форматы изображений, у разработчиков есть два основных варианта: использовать SVG либо иконочные шрифты (icon fonts). Что лучше? Разберемся ниже.

Эволюция иконок

Перед тем, как появился язык стилей CSS, все иконки на сайтах представляли собой изображения. Но так как файлы изображений много весят, разработчики стремились найти один или несколько альтернативных способов отображения маленьких иконок. Например, CSS-спрайты позволили разработчикам хранить все иконки на одном изображении, но из-за проблем с доступностью этот способ не стал популярным способом отображения иконок — и в 2012 на смену им пришли иконочные шрифты. А сейчас многие разработчики отдают предпочтение масштабируемой векторной графике — SVG (Scalable Vector Graphics).

Что такое иконочные шрифты

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

Но, как и у CSS-спрайтов, иконочные шрифты имеют свои недостатки — например, для того, чтобы корректно их отобразить, браузеру приходится делать дополнительные запросы на сервер, что может привести к FOIT (Flash of Invisible Text) — ситуации, когда шрифт не отображается вообще. По этой и другим причинам многие разработчики делают выбор в пользу SVG.

Что такое SVG

SVG (Scalable Vector Graphics) позволяет отображать в браузере векторную графику. Формат SVG быстро стал новым стандартом для иконок и анимации. Они быстрее загружаются, прекрасно масштабируются и более надежные в использовании, чем иконочные шрифты. Векторная графика полностью стоит из кода и весит гораздо меньше, чем изображения в форматах JPG или PNG и большинство библиотек иконочных шрифтов.

Сравнение

Настало время сравнить SVG и иконочные шрифты по нескольким параметрам.

1. Размер

Если использовать встроенный SVG, то есть прописывать SVG в CSS, то код может стать тяжелым и громоздким. К тому же встроенный SVG код не кэшируется пользовательскими браузерами, в отличие от внешних SVG файлов. Поэтому если на определенной странице сайта много разных иконок, то иконочные шрифты будут предпочтительнее встроенных SVG изображений (но при условии, что вы не используете готовую библиотеку иконочных шрифтов).

Важно понимать, что 10 оптимизированных SVG иконок, скорее всего, будут весить меньше, чем целая библиотека иконочных шрифтов. А вот если вы создадите библиотеку только с теми иконками, которые нужны вам, то такая библиотека будет выигрывать по весу.

2. Производительность

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

Встроенные SVG иконки не требуют дополнительного запроса, но и кэшироваться браузером они тоже не могут.

Можно собрать SVG файлы в отдельный внешний файл — и тогда его можно будет кэшировать.

Опять же, производительность во многом зависит от того, сколько весят ваши иконочные шрифты/SVG.

3. Гибкость

Оба формата можно настраивать с использованием CSS, но SVG дает гораздо больше возможностей, например, сделать иконки разноцветными.

Иконочным шрифтам можно прописывать CSS-стили (тень, цвет и т.д.), их можно массово изменять при помощи одного правила в CSS, их можно анимировать.

4. Поддержка браузеров

Какой бы формат вы ни выбрали, его все равно нужно будет дорабатывать для того, чтобы обеспечить поддержку старых браузеров. Т.к. иконочные шрифты существуют дольше, чем SVG, то и поддержка у них шире — их увидят все, кто использует IE 6 и более новые версии.

С другой стороны, сейчас подавляющее большинство пользователей использует современные браузеры, так что на этот пункт сильного внимания обращать не стоит. Единственный нюанс, о котором стоит помнить — IE и Edge не всегда правильно масштабируют SVG файлы.

5. Масштабируемость

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

Вывод

До сих пор в среде разработчиков нет единого мнения о том, что лучше использовать — иконочные шрифты или SVG. Суть в том, что зачастую многое зависит от поставленных задач и проекта в целом.

Но все же сейчас чаще всего используют SVG — у этого языка разметки лучше масштабируемость, UX (пользовательский опыт), и он поддерживается всеми основными браузерами. Существует мнение, что один из трендов 2018 года — это уход от иконочных шрифтов к иконкам в формате SVG.

В то же время иконочные шрифты станут хорошим решением для проекта с большим количеством иконок в одном стиле.

А что вы используете в разработке, SVG или иконочные шрифты?

Иконочные шрифты для сайта

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

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

Как подключить иконочный шрифт

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

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

Список иконочных шрифтов

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

Font awesome 5, 6
fontawesome.io
Font awesome 4
fontawesome.ru
Fontello
fontello.com
Pictonic
pictonic.co
Open iconic
useiconic.com
Icons 8
icons8. com
Material Design icons
materialdesignicons.com

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

25+ бесплатных иконических шрифтов (Icon Fonts) для дизайна вашего WordPress сайта

Знаете, как можно легко и элегантно приукрасить дизайн вашего WordPress сайта? С помощью шрифтовых иконок!

Главное достоинство и преимущество Icon Fonts заключается в том, что эти значки выглядят как графические элементы, но по сути являются шрифтом. А это значит, что эти иконки мгновенно загружаются и масштабируются на экранах с любым разрешением, ведь они векторные.

Смотрите также:

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

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

В этом посте мы отобрали 27 бесплатных наборов шрифтовых иконок. Просто переходите по ссылке понравившегося набора, загружайте и добавляйте на свой сайт WordPress.

1. Font Awesome

3. Themify Icons

4. Foundation Icon Fonts 3

5. Elegant Icon Font

6. Dripicons

7. Pictonic

8. Sosa

9. Typicons

10. Metrize Icons

11. Ionicons

12. Symbol Signs

13. IcoMoon

14. Batch

15. Socialico

16. Raphaël Icon-Set

17.

Entypo

18. MFG Labs Icon Set

19. Ligature Symbols

20. PW Drawn Icon Font

21. Fontelico

22. Feather Icon Set

23. Premium Pixels

24. Rondo Social Icon Font

25. Map Icons

26. Weather Icons

27. Space Icons

Смотрите также:

Изучает сайтостроение с 2008 года. Практикующий вебмастер, специализирующий на создание сайтов на WordPress. Задать вопрос Алексею можно на https://profiles.wordpress.org/wpthemeus/

почему некоторые шрифты-потрясающие иконки не отображаются

Я использую font-awesome с Angular 5 для моего UI. Поскольку я использую sass , я добавил следующую строку в .angular-cli.json после установки font-awesome

"styles": [
        ". ./node_modules/font-awesome/scss/font-awesome.scss",
        "../node_modules/bootstrap/scss/bootstrap.scss",
        "styles.scss"
      ],

Некоторые из иконок работают так же как

<i></i>
<i></i>

Однако гораздо большего не делает. Например, я хотел использовать этот значок гистограммы с fas fa-chart-bar , но он ничего не показывает. Такие вещи, как fas fa-camera-retro , отображаются только как странный квадрат вместо реального значка.

Почему некоторые из иконок не работают? Есть ли способ проверить, существуют ли эти классы css в пакете font-awesome, который я установил?

EDIT

Просто поискал диаграмму bar в node_modules\font-awesome\css\font-awesome.css , и существует только fa-bar-chart , а не fa-chart-bar . У меня есть последний шрифт-потрясающий, когда я его установил (4.7.0). Почему на их сайте написано fa-chart-bar . Просто заставил его работать с fa fa-bar-chart . Почему это fa , а не fas -выше моего понимания

html css angular font-awesome
Поделиться Источник ddd 26 марта 2018 в 02:29
5 ответов
Шрифт потрясающие иконки не отображаются с IE9
У меня есть веб-сервер, работающий на linux Redhat с apache. На моем сервере размещены шрифты ‘font awesome’. При запросе веб-страниц с другого компьютера, Если используется Chrome, значки отображаются правильно. Если используется ie9, то значки не отображаются. Если страница ‘font awesome’…
Шрифт-потрясающие иконки не отображаются, но main.css отображается
У меня есть проект с bootstrap en font-awesome setup если я просматриваю свой main.css, то первое, что я вижу, это то, что Font-awesome импортирован. И все его иконки, я не понимаю, почему html не подбирает классные шрифты. /*! * Font Awesome 4.4.0 by @davegandy — http://fontawesome.io -…

10

Просто поискал гистограмму в node_modules\font-awesome\css\font-awesome.css и только fa-bar-chart существует, а не fa-chart-bar. У меня есть последний шрифт-потрясающий, когда я его установил (4.7.0). Почему на их сайте написано fa-chart-bar. Только что получил его для работы с fa fa-bar-chart. Почему это ФА, а не ФАС-выше моего понимания
Это было изменено с выпуском FA5, потому что теперь существует несколько стилей для иконок:
fas : FontAwesome твердое тело
far : FontAwesome обычный
fab : FontAwesome бренды
fal : FontAwesome свет
Однако FontAwesome5 free имеет твердое тело только для большинства иконок. Для полного опыта вам придется заплатить за FontAwesome Pro .
Выберите любую иконку в галерее , чтобы посмотреть, какие стили доступны для нее в каком выпуске. NB: FA4-иконки здесь .
Поделиться MBaas 26 марта 2018 в 08:02

8

Работал на меня после обновления до последней версии Font Awesome:
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
Поделиться jakobinn 15 февраля 2019 в 23:42

0

Я должен был сделать это один раз. Я думаю, что некоторые мобильные устройства не загрузили один из шрифтов:
font-family: "Font Awesome 5 Free", "FontAwesome";
Поделиться Kyle Lester 27 июля 2019 в 21:30

0

Вы не можете использовать V5-релиз FontAwesome. Просто используйте последнюю версию FontAwesome 4, она должна работать. Использовать эту ссылку
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
Поделиться Sampad 26 марта 2018 в 04:54

0

У меня была та же проблема. Страница поиска иконок, которую я нашел в Google, была устаревшей. Убедитесь, что вы ищете последнюю версию сайта.
Как и ты, я нашел эту икону :
<i></I>
Это не сработало. Если вы поищете на сайте , то увидите, что это так :
<i></i>
Поделиться Sébastien Gicquel 11 февраля 2019 в 09:51
Похожие вопросы:

Шрифт потрясающие иконки не отображаются
Я пытаюсь использовать некоторые потрясающие значки шрифтов в своей навигационной системе. Просто несколько простых стрелок вниз рядом с каждым элементом списка. Если я делаю горячую ссылку на шрифт…

css семейство шрифтов : почему некоторые шрифты не отображаются на мобильных устройствах
Кто-нибудь знает, почему некоторые из моих семейств шрифтов не будут отображаться на некоторых мобильных устройствах? Вот страница, на которой демонстрируются шрифты: http://jl.evermight.com/шрифт /…

Статически вращать шрифт-потрясающие иконки
Я хотел бы статически повернуть свои потрясающие шрифты иконки на 45 градусов. Там написано на сайте, что: Чтобы произвольно вращать и переворачивать значки, используйте классы fa-rotate-* и…

Шрифт потрясающие иконки не отображаются с IE9
У меня есть веб-сервер, работающий на linux Redhat с apache. На моем сервере размещены шрифты ‘font awesome’. При запросе веб-страниц с другого компьютера, Если используется Chrome, значки…

Шрифт-потрясающие иконки не отображаются, но main. css отображается
У меня есть проект с bootstrap en font-awesome setup если я просматриваю свой main.css, то первое, что я вижу, это то, что Font-awesome импортирован. И все его иконки, я не понимаю, почему html не…

Шрифт-потрясающие иконки начальный заполнитель?
Я использую шрифт потрясающие иконки с рекомендованной справочной Javascript : <script src=https://use.fontawesome.com/7c7031cd1a.js></script> Когда страница завершает загрузку и…

Шрифт потрясающие иконки не загружается с атрибутом целостности
Я использую приложение angular 6. В файле index.html у нас есть потрясающая ссылка на шрифт, например: <link rel=stylesheet href=https://use.fontawesome.com/releases/v5.1.0/css/all.css…

шрифт-потрясающие шрифты не загружаются в проект angular
Я уже некоторое время использую angular 5, и мне кажется, что я не могу загрузить какие-либо потрясающие шрифты в свой встроенный проект. Я тщательно следовал инструкциям, упомянутым в приведенной…

шрифт потрясающие иконки не отображаются в html
у меня есть контактная форма в html , я дал шрифту потрясающие иконки для полей ввода, офис находится ниже: <link rel=stylesheet…

Webpack: как импортировать только необходимые шрифты-потрясающие иконки?
Я импортирую только 10 шрифтов-потрясающие иконки, такие как import FaClipboardList from ‘react-icons/fa но webpack загружает все шрифты-потрясающие иконки. Можно ли скачать только то, что мне…
200 иконок в шрифте
Добро! Последнее время для интерфейсов сайтов, которые я делаю, стал применять иконки, которые заключены в шрифт. Есть очень известный и популярный Font Awesome, но и есть его аналоги и некоторые из них с более качественным исполнением иконок или просто сделанных в другом стиле. Хочу поделиться с Вами менее известной сборкой иконок, заключенных в шрифте под названием Stroke-Gap-Icons.

Плюсы иконок-шрифта

Чем же так хороши иконки, заключенные в шрифт. А я Вам скажу чем:

Вы не зависите от размера иконок в пикселях, вы просто выставляете размер шрифта и все. Качество иконки не будет зависесть от ее размера.

Шрифт, это тот же спрайт, только весит меньше и подгружается быстрее.

Вам не нужно постоянно писать код под каждую иконку, чтобы она появилась на сайте. Вам нужно всего лишь вставить название класса в любой блок и иконка появитсья там, где нужно! Вы также можете использовать параметр content: и вставлять код иконки куда угодно (код вы можете взять в основном css файле)

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

Как подключить эти иконки

Подключить данный шрифт-иконки не составит никакого труда:

1. Скачиваем архив, разархивируем его на рабочий стол, закачиваем файл fonts.css и папку fonts в корень вашего сайта.

2. Вам нужно лишь вставить подкючить css файл fonts.css, отвечающий за подключение шрифта и отображение иконок на сайте. Делаем это посредством вставки следующего кода между <head> и </head>:

<link rel="stylesheet" href="fonts.css">

3. Теперь открываем демо, находим нужную иконку и вставляем например вот такой html код:

<span></span>

Это самая первая иконка в сборке, а допустим чтобы вставить иконку пиццы нужно вместо

icon-WorldWide

поставить

icon-Pizza

и мы получим такой код:

<span></span>

и иконку пиццы на сайте.

Надеюсь иконки Вам пригодились, всем всего хорошего и до новых постов.

Помогла статья? Угости чашечкой кофе =)
Веб-шрифты, шрифтовые иконки и спецсимволы
Иконочные шрифты
fontawesome.com — Font Awesome 5. Более 1500 бесплатных иконок, подключение через CDN, также есть возможность скачать файлы шрифта на диск
fontawesome.ru — Font Awesome иконочный шрифт и CSS-инструментарий
fontello.com — Онлайн-сервис для подбора иконок из множества иконочных шрифтов, также с помошью этого инструмента можно создавать свои шрифтовые иконки из изображений в формате SVG
icomoon.io — Большой набор качественных SVG-иконок, на сайте можно создать свой набор и иконок конвертировать набор в иконочный шрифт, шрифт можно скачать или подключbть в проекте с помощью URL
iconify. design — Этот сервис позволяет подключить к проекту иконки из множества наборов с помощью одного скрипта и используя один синтаксис. Iconify включает более 40 000 иконок из популярных шрифтов и наборов смайликов: Font Awesome 4 и 5, Material Design Icons, IonIcons, Vaadin Icons, Entypo + и многие другие
material.io/resources/icons — Большая коллекция красивых иконок от Google для веб-проектов и приложений Android, iOS. Иконочный шрифт подключается с помощью URL или можно скачать шрифт и подключать локально, также можно скачать SVG и PNG версии иконок
hostenko.com — В этом посте мы отобрали 27 бесплатных наборов шрифтовых иконок. Просто переходите по ссылке понравившегося набора, загружайте и добавляйте на свой сайт WordPress
Веб-шрифты
fonts.google.com — Генератор веб-шрифтов Google
fontstorage.com — Скачать бесплатно шрифты для сайта, фотошопа, Windows или Mac OS
Спецсимволы
html5book.ru — Спецсимволы HTML (символы-мнемоники) — стрелки, смайлики, крестики, галочки, звезды, математические символы и многое другое
htmlbook. ru — Для отображения символов, которых нет на клавиатуре, применяются специальные знаки, начинающиеся с амперсанда (&) и заканчивающиеся точкой с запятой (;). В таблице приведены некоторые популярные спецсимволы
unicode-table.com — Сервис поиска символов в формате Юникод (Unicode)
Калькулятор для конвертации HTML-кода в CSS-код для использования в свойстве content (content:’260E’)
10 лучших бесплатных графических шрифтов для веб-дизайнеров
Веб-шрифты с открытым исходным кодом позволяют дизайнерам радикально изменять дизайн своих страниц и типографские стили. И некоторые из этих веб-шрифтов используют наборы значков для переноса векторных значков в CSS. Если вы ищете 100% бесплатные шрифты для иконок для своего веб-сайта, то в этом посте собраны все лучшие из них. Каждый пакет значков полностью бесплатен с векторами SVG и форматами веб-шрифтов для включения в ваши таблицы стилей и веб-страницы.
НЕОГРАНИЧЕННАЯ ЗАГРУЗКА: 1500000+ иконок и элементов дизайна

СКАЧАТЬ
1.
Капитан Иконка
Мой личный любимый веб-шрифт — это пакет Captain Icon, созданный дизайнером Марио дель Валле. Это полностью бесплатный проект с открытым исходным кодом, размещенный на GitHub, с векторными файлами и веб-шрифтами.
Что мне больше всего нравится в этом пакете значков, так это его стиль. Каждый значок имеет уникальный дизайн, и все они нарисованы от руки с нуля. Это отличает их от других более общих наборов значков.
Но я не думаю, что Captain Icon подходит для каждого проекта.Его лучше всего использовать на творческих сайтах, где нарисованный от руки стиль сочетается с макетом.
2. Octicons
GitHub недавно открыл собственный пакет значков под названием Octicons. Этот бесплатный набор значков в настоящее время находится в версии 5.0 и включает в себя десятки значков с некоторыми основными символами.
Эти значки можно найти по всему сайту GitHub. Но они достаточно просты, чтобы работать практически с любым интерфейсом.
Если вам нужен простой и легкий иконочный шрифт, Octicons вас не подведет.
3. Типики
Набор Typicons с закругленными углами и более простыми очертаниями идеально подходит для любого сайта. Он поставляется с более чем 330 уникальными иконками в одинаковом стиле.
Пакет полностью бесплатный, а также доступен на GitHub. Это означает, что вы можете включать значки прямо на свой сайт и даже при необходимости вносить в них изменения.
Немногие знают о Typicons, но это один из лучших доступных иконочных веб-шрифтов. Они могут работать даже на iOS с небольшими изменениями и специальными фрагментами кода.
4. Zondicons
Zondicons абсолютно бесплатны, и их очень легко добавить на свой сайт. К сожалению, они не размещены на GitHub, поэтому у них нет архива обновлений.
Но вы можете увидеть все примеры на демонстрационной странице, включая классы CSS, необходимые для их правильной работы. Основная ссылка для загрузки Zondicons идет прямо с веб-сайта, поэтому сложно сказать, обновлялись ли они когда-либо или добавлялись новые значки.
Я рекомендую этот шрифт, если вы не против более простого дизайна.Это значительно упрощает использование значков, но они также могут сливаться с сайтом в более «общем» стиле.
5. Entypo
Семейство иконок веб-шрифтов Entypo существует уже несколько лет. Эти значки великолепны, и они первоклассные, когда дело доходит до бесплатных услуг.
Новые значки добавляются время от времени, и к ним очень легко получить доступ. Шрифты также разделены на два пакета: основной пакет и социальный пакет. Так что, если вам не нужны значки социальных сетей, вы можете немного уменьшить размер файла шрифта.
Entypo поставляется с более чем 400 значками и великолепной лицензией CC sharealike. Чтобы узнать больше об установке и настройке значков, вы должны прочитать страницу часто задаваемых вопросов и посетить главное репозиторий GitHub.
6. MFG Labs
Один из новейших шрифтов в этом списке предоставлен MFG Labs со своим собственным набором значков. Это совершенно бесплатно и размещено на GitHub для всеобщего доступа.
Каждый значок упакован в стандартные форматы веб-шрифтов с использованием PUA Unicode в CSS.Это полностью семантически во всех браузерах и помогает уменьшить конфликты с другим кодом CSS.
Иконки MFG Labs имеют уникальный стиль, который выделяется среди всех остальных. Я настоятельно рекомендую этот иконочный шрифт для любого типа веб-сайтов, коммерческих или иных.
7. Иониконы
Разработчики
Native любят Ionic Framework, и это один из самых популярных вариантов для мобильных приложений. Команда Ionic решила выпустить свои значки в виде веб-шрифта под названием Ionicons.
Естественно, они абсолютно бесплатны и доступны на GitHub.Вы даже можете добавить эти значки прямо на свой сайт, используя версию таблицы стилей для CDN.
Я в основном рекомендую Ionicon для новичков, которые раньше не использовали шрифты со значками. Их очень легко настроить, и как только вы поймете, как они работают, вы можете перейти практически к любому другому значку веб-шрифта.
8. Font Awesome
Оригинальный веб-шрифт и личный выбор Bootstrap, Font Awesome, пожалуй, окончательный выбор для большинства веб-дизайнеров.
Font Awesome существует уже много лет и считается первым крупным иконочным шрифтом с открытым исходным кодом.Он часто получает новые обновления со свежими значками, и в настоящее время он находится в версии 4.7, которую можно бесплатно загрузить на GitHub.
Каждый значок полностью масштабируется и поддерживается непосредственно в CSS. Вы можете изменять цвета, тени, фоновые градиенты и многое другое, используя чистый CSS3.
Это, безусловно, один из самых безопасных наборов значков, который вы можете использовать, и вы знаете, что он будет здесь надолго.
9. Значки материального дизайна
Материальный дизайн Google привнес новый подход к UI / UX в Интернете.Это привело к появлению множества новых фреймворков и ресурсов, включая этот шрифт значка материального дизайна.
Эти значки материалов совершенно бесплатны и доступны на GitHub. Этот набор значков абсолютно массивен: более 1000 значков, охватывают широкий спектр функций интерфейса.
И поскольку это открытый исходный код, вы можете повторно использовать их в любых проектах и даже настраивать значки, если это необходимо. Идеально подходит для тех, кто работает с правилами Google в отношении материалов в Интернете.
10.Девиконы
Пакет Devicons — один из новейших веб-шрифтов, который вы можете попробовать с упором на технические логотипы и брендинг.
На этом значке шрифта есть все логотипы, о которых вы только можете подумать, от крупных технических игроков, таких как Google, до новых логотипов CMS, таких как Ghost. Признаюсь, это полезно только для сайтов, которым нужны векторные технические логотипы, которых определенно не будет.
Но это здоровенный набор иконок, и он совершенно бесплатный! На этой странице вы найдете сведения об установке бесплатной версии CDN, которую можно использовать для сокращения времени загрузки.
Завершение
Трудно выбрать всего десять шрифтов для иконок, потому что каждый год выпускается так много новых. Но это мой лучший выбор, и если вы порекомендуете других, обязательно поделитесь в комментариях ниже.
Этот пост может содержать партнерские ссылки. Смотрите наше раскрытие о партнерских ссылках здесь .
14 бесплатных графических шрифтов для веб-дизайнеров
Примечание: Перед использованием любого из перечисленных ниже графических шрифтов вы должны прочитать их лицензию и условия использования.
Дизайн веб-сайта важен для любой компании, которая хочет привлечь клиентов. Наличие подходящих и последовательных шрифтов для иконок — одна из составляющих того, что делает дизайн таким эффективным и успешным. Ваш шрифт может легко стать решающим фактором между клиентом, который решит остаться на вашем сайте, и тем, кто решит уйти.
Ionicons Страница загрузки
2. Шрифт значка Shock (1121 значок)
Полное раскрытие информации: Я основатель семейства веб-сайтов Shock, и этот бесплатный шрифт с иконками был создан моей компанией.
Скачать шрифт
Shock Icon, страница
Dripicons Страница загрузки
4. Entypo (250 иконок)
Entypo Страница загрузки
5. Соса (160 иконок)
Sosa Страница загрузки
Foundation Иконки Страница загрузки
7. Обозначения (308 иконок)
Typicons Страница загрузки
The Elegant Icon Загрузка шрифта
Иконки карты Загрузить Страница
Лигатурные символы Страница загрузки
Скачать
Heydings Icons Страница
Fontawesome Страница загрузки
13.Signify (38 иконок)
Страница загрузки Signify
14. PulsarJS (73 иконки)
PulsarJS Страница загрузки
Как использовать шрифты со значками
Узнайте, как использовать шрифты значков, прочитав эти руководства:
HTML для использования шрифтов значков (css-tricks. com)
Зачем и как использовать графические шрифты (vanseodesign.com)
Как использовать иконочные шрифты на своем веб-сайте (designmodo.com)
Реальный совет
WebFX — это агентство цифрового маркетинга с полным спектром услуг, которое предлагает все, от SEO-ссылок до маркетинга в социальных сетях.Знание того, как успешно использовать иконочные шрифты, выделит вас среди ваших конкурентов. Стоимость веб-дизайна не должна стоять между вами и вашим бизнесом, привлекающим новых клиентов. WebFX предлагает отличные советы по отраслевому дизайну веб-сайтов, например, по веб-дизайну для отелей.
Если вы хотите улучшить свой сайт или узнать больше, вы можете связаться с нами по телефону 888-601-5359, чтобы поговорить со стратегом.
50 лучших бесплатных шрифтов с иконками для дизайна пользовательского интерфейса
Хотя шрифты Icon очень популярны, у них есть свои подводные камни.Ян Фезер рассказал о причинах перехода с иконочного шрифта на SVG, а CSS Tricks изложил некоторые соображения при выборе между иконочной системой шрифтов или SVG. Оба явно отдают предпочтение SVG. В качестве контраргумента Pictonic сказал, что шрифты иконок на 10% быстрее, чем SVG. Это как раз то, что вам следует учесть, прежде чем использовать шрифты со значками.
Чтобы ваши значки всегда загружались правильно и имели надежные резервные копии для браузеров, не поддерживающих @fontface , вам следует ознакомиться с рекомендациями, изложенными в Filament Group , Bulletproof Accessible Icon Fonts.
Вам также может понравиться: 50 лучших бесплатных наборов иконок для веб-дизайнеров.
Если вы разрабатываете новый интерфейс или хотите продемонстрировать возможности своего продукта, обратите внимание на этот замечательный (и бесплатный) шрифт с иконками. Эти значки с открытым исходным кодом обозначают действия и элементы; от стрелок и вложений до цветовых палитр. Это полный пакет с более чем 480 значками!
Нет ничего лучше минимализма, чтобы подчеркнуть качество вашего продукта, и этот набор иконок — отличный выбор для вашего следующего проекта. Они векторные и полностью редактируются в Adobe Illustrator. От значков частоты до красивых значков переключения контуров — у вас есть все, что вам нужно!
Перестаньте беспокоиться о том, чтобы ваши значки работали с форматированием текста. Этот набор значков с открытым исходным кодом включает более 230 практических и технических значков в различных форматах; из SVG в WOFF. Вы можете легко изменить их размер в соответствии с вашими потребностями с помощью CSS, и они отлично читаются даже при 8 пикселях.
Pictypo предлагает забавные и привлекательные значки, созданные с использованием шрифтов дингбата.Скругленный стиль добавляет дружелюбия, и вам будет с чем поработать. Pictypo предлагает все, что вам нужно, от значков погоды до символов офиса. Линии жирные, поэтому они хорошо смотрятся и на больших дисплеях.
Ionicons — это полноценный набор иконок для Ionic framework. Вы получите множество значков приложений (уведомления, стрелки, еда и т. Д.), А также значки с логотипами известных брендов (например, Pinterest). В зависимости от ваших потребностей вы можете загрузить контурные, заполненные и / или четкие изображения значков в виде файлов SVG и веб-шрифтов.
Сделайте свой следующий проект более динамичным и увлекательным с помощью Icoframe — красивых и современных каркасных иконок. Вы получите 60 минималистичных каркасных иконок; от символов для страниц входа до значков сетки, шкалы времени и типографики. Дизайн очень интуитивно понятный, и вы можете легко настроить их в Adobe Illustrator.
Font Awesome — массивный и очень популярный набор иконок. Они предлагают более 1600 бесплатных иконок, каждая из которых была тщательно разработана, чтобы продемонстрировать удобство и простоту использования.В галерее FA вы найдете все: от логотипов AWS и других брендов до значков бизнеса и образа жизни.
Шрифты
Wirebet — отличный выбор, если вы хотите оптимизировать рабочий процесс и интегрировать привлекательные значки в свои материалы, не загружая свой набор для дизайна. Вы получите множество технических значков; от символов для страниц портфолио до стрелок и значков устройств. Wirebet идеально подходит для вайрфреймов!
Добавьте современные значки линий в свои материалы в одну строку кода с помощью Line Awesome.Он улучшает предложение Font Awesome и позволяет добавлять всевозможные значки (от специальных возможностей и создания до стрелок и значков брендов) на ваш веб-сайт (через CDN), прототипы Figma и многое другое.
Crafty Collection предлагает 24 привлекательных и забавных шрифта, которые вы можете использовать, чтобы сделать свой следующий дизайн намного более захватывающим. От звезд и полос до грубых контуров и брызг — The Crafty Collection предлагает сочетания шрифтов, которые хорошо сочетаются друг с другом, поэтому ваши дизайны всегда будут выглядеть связно и интересно.
Dashicons — это иконочный шрифт для WordPress. Если вы хотите подражать фирменному стилю WP в других проектах, вам это понравится. Он очень техничный по стилю, но он передает суть и прост в использовании. От логотипов брендов до TinyMCE — разгуляйтесь!
Этот набор линейных значков поставляется в двух форматах: легко редактируемые векторные изображения, которые можно настроить в Adobe Illustrator, и веб-шрифт plug-and-play. Вы получите 130 минималистичных тонких иконок для работы; от значков сообщений до символов камеры и микрофона, как в Microsoft Windows 10.
Remix Icon — это библиотека значков с открытым исходным кодом, содержащая более 2200 значков. Все значки бесплатны как для личного, так и для коммерческого использования. Вы увидите множество значков; от тонких контурных значков до закрашенных символов для дополнительного акцента. Получите их как PNG, SVG или код.
Если вы ищете другой набор значков, вам понравится эта коллекция шрифтов для значков! Он идеально вписывается в современный дизайн инфографики, но предлагает креативную визуализацию типичных значков, которые выделят ваш бренд. От аналитики до поддержки клиентов — есть что любить!
Вдохновленные Apple iOS, иконки Themify предлагают более 300 красивых и минималистичных иконок. От стрелок до значков приложений вы получите все необходимое в виде шрифта значка для упрощения интеграции с рабочим процессом (включая SVG) или плагина для WordPress. Иконки Themify идеально подходят для современного дизайна пользовательского интерфейса!
Если вам не нужны значки линий садового разнообразия, обратите внимание на Dripicons. Этот бесплатный шрифт с иконками невероятно прост в использовании, но самое главное, они красивы! Вы получите набор универсальных значков, выделенных жирным шрифтом; от стрел и техники до образования и музыки.
Если вам нравится эстетика GitHub, вам понравятся их Octicons. Эти значки доступны в двух размерах (16 пикселей и 24 пикселей), и они также включают некоторые специальные значки, такие как запросы на вытягивание. Вы можете переключаться между контурными и заполненными значками. Они отлично работают с разными языками программирования.
Начните с нескольких строк кода и значков Foundation. Эта коллекция состоит из разных наборов; от общих значков до значков специальных возможностей, так что найдется что-то для каждого проекта.Значки Foundation работают как веб-шрифт, поэтому вам не придется прыгать через обручи.
Devicons — это иконочный шрифт, созданный специально для разработчиков и самых разных проектов. Шрифт содержит 85 значков, в основном логотипы брендов для таких сервисов, как Dropbox, и платформ программирования, таких как PostgreSQL. Devicons можно интегрировать, добавив одну строку кода в HTML-заголовок проекта.
Красивый, элегантный и привлекательный — этот иконочный шрифт содержит более 300 разнообразных иконок.Их легко интегрировать и использовать, особенно если в прошлом вы использовали Elegant Themes или конструктор Divi. В этом наборе вы найдете все, от значков файлов до стрелок.
Сохраняйте простоту и доступность с помощью Feather, обширной коллекции иконок с открытым исходным кодом. От стрелок и шевронов до значков пользовательского интерфейса приложений — Feather — отличное дополнение к стандартному набору инструментов для дизайна. Вы можете настроить размер, ширину обводки и цвет каждого значка, чтобы они идеально соответствовали вашему бренду.
Простые, удобные и идеальные для самых разных проектов, Typicons — отличный выбор. Они встроены в веб-шрифт, поэтому ими легко пользоваться. Вы получите 336 иконок; от винтиков и стрелок до логотипов брендов. Вы можете выбирать между значками с заливкой или контурами.
Обновите свой стандартный набор инструментов с бесплатными значками IcoMoon. Вы получите 490 векторных иконок, которые идеально подходят для приложений и веб-интерфейса. Эти иконки просты и минималистичны, с небольшой индивидуальностью.От иконок для дома до смайликов — в этом весь комплекс!
Упростите свой дизайн с помощью Genericons, набора простых и минималистичных иконок для веб-дизайна и дизайна приложений. Они идеально подходят для блогов или простых веб-сайтов, где вы хотите сосредоточить внимание на обмене сообщениями. Вы получите множество значков для основных функций; из карт сайта в RSS-каналы.
Icon-Works — бесплатный и стильный графический шрифт — отличный выбор, если вы хотите выделить свой следующий дизайн. Вы получите множество красивых, готовых к работе с сетчаткой значков, которые можно настроить.Они масштабируемы, поэтому вам даже не нужно беспокоиться об изменении их размера.
Иконки
Micron гордятся своей простотой. В коллекции представлены все значки для наиболее распространенных случаев использования; от диаграмм и стрелок до значков навигации. Их легко кодировать, а размер самого файла составляет всего 5 КБ, поэтому они идеально подходят для использования в вашем портфолио проектов.
Прямо из мастерской Pixeden, Stroke 7 представляет собой набор тонких иконок. Набор предлагает более 200 иконок, которые можно настроить с помощью CSS. Они были вдохновлены иконами начала 00-го, поэтому они не будут выделяться и отвлекать внимание от вашего основного сообщения.
Петрас Наргела разработал набор из 80 штриховых иконок, и это бесплатно. Эти красивые иконки свежие, чистые и готовы оживить ваш дизайн. Вы можете скачать их как файлы PSD, AI или веб-шрифтов. Если вам нужно что-то другое, вы это нашли!
Набор значков Material Design, созданный Google, содержит множество значков, которые вы можете использовать в своих проектах.Вам просто нужно добавить одну строку кода на свой сайт, и все готово! Поскольку участники сообщества постоянно добавляют свои собственные значки, существует много разнообразия.
Если ваш пользовательский интерфейс минималистичен, выбирайте значки, которые следуют тем же эстетическим подсказкам. Этот минимальный набор иконок содержит более 70 чистых и четких иконок. Векторы масштабируемы, и вы можете легко изменить цвета значков в соответствии со своим стилем. Вы можете бесплатно скачать их в различных форматах.
Tonicons — это фантастический набор иконок-шрифтов, которые не только просты в использовании, но и красивы! Вы получите 300 чистых и минималистичных иконок для дизайна приложений и веб-интерфейса.Набор Tonicons охватывает все варианты использования, от всех типов файлов до значков для обмена сообщениями.
иконок Metrize — это 300 иконок в стиле метро, которые придадут импульс вашему следующему проекту. Вы можете использовать их для приложений и веб-сайтов, и все это очень просто, поскольку они также доступны в виде веб-шрифтов. От логотипов брендов до стрелок — Metrize поможет вам!
CSSans — это красочный и динамичный шрифт CSS. Состоящие из множества красочных геометрических элементов, которые добавляют яркости вашему дизайну, CSSans — это индивидуальность! Вы получите уникальные прописные и строчные буквы, цифры и другие символы.Его можно настраивать бесконечно, и он сразу привлекает внимание!
Набор значков
MFG Labs изначально разрабатывался для внутреннего проекта, но команда не могла устоять перед тем, чтобы поделиться этим универсальным набором значков. Их легко встраивать и настраивать с помощью CSS. Вы найдете все значки, необходимые для создания правильной атмосферы для вашего следующего дизайна.
Ligature Symbols — это иконочный шрифт с забавными и минималистичными иконками. Отдельные значки можно комбинировать для создания лигатур (например,грамм. объединить значки таблиц и ячеек для создания сеток), что повышает удобство использования этой коллекции. Вы найдете все, что вам нужно, так что попробуйте этот бесплатный шрифт с иконками!
Devicons — это дружественные, удобные для разработчиков значки, созданные для представления инструментов программирования и разработки. От Chrome и Confluence до Django и Adobe Illustrator вы найдете значок, который так долго искали. Вы можете легко скопировать и вставить их в свои проекты, используя либо версии шрифтов, либо версии SVG.
Простые и чистые, эти мини-иконки идеально подходят для самых разных проектов, особенно более формальных по тону. Эта коллекция значков содержит 80 точно созданных значков как в формате PSD, так и в формате значков. От символов загрузки / выгрузки до значков местоположения и погоды — этот набор предлагает все, что вам нужно!
Набор иконок Тараса Шипки «Гелий» предлагает множество иконок. Они не только бывают всех мыслимых форматов, но вы также можете использовать их в качестве шрифта значков. Вы получите 112 иконок с тонкими линиями, которые добавляют блеск. Гелий определенно выбор эстетов!
Набор Gonzocons, разработанный Яном Райторалом, предлагает 100 линейных иконок, которые идеально воспроизводят современные тенденции дизайна иконок.От простых стрелок до жизнерадостных сердец и песочных часов — иконы Gonzocons определенно обладают индивидуальностью. Вы можете получить их как файлы SVG или как веб-шрифт для упрощения интеграции с вашим приложением / сайтом.
Map Icons — это шрифт значков, созданный для Google Maps and Places. Вы можете легко настроить значки с помощью CSS и выбрать из более чем 175 значков. От общих значков для парикмахерских до значков для мероприятий — в этом наборе есть из чего выбрать, чтобы сделать ваш следующий проект потрясающим.
Простой и увлекательный набор из 150 обведенных значков.Вы можете получить их в виде файлов PSD, AI, SVG или веб-шрифтов. Иконки Дарио Феррандо вдохновлены современным дизайном веб-иконок, но в них много индивидуальности, чтобы выделить ваш следующий проект и поразить аудиторию.
Стреляйте на Луну с этими красивыми космическими иконками. Вы получите более 230 символов, включая космические корабли, планеты и многое другое! Их очень легко использовать, поскольку они представляют собой шрифт дингбата, и если вы начнете вводить числа, вы найдете всю солнечную систему.
Эта коллекция иконок идеальна для любой ситуации, в любую погоду.Помимо прочего, этот набор значков погоды также можно загрузить в качестве шрифта для облегчения использования, и вы найдете 32 значка, отображающих все условия. Вы также получите полностью редактируемый набор иконок AI.
Если точные прогнозы необходимы для вашего следующего проекта, вам понравится этот набор значков на тему погоды. С более чем 200 значками (включая специальные значки, такие как 28 лунных фаз), вы будете готовы создать что-то удивительное! Вы можете легко настроить их с помощью CSS в соответствии со своими потребностями.
Получите 40+ минималистичных и дружелюбных иконок погоды с Meteocons.Этот набор предлагает все мыслимые форматы; от SVG до настольных и веб-шрифтов. Их можно использовать как в личных, так и в коммерческих целях, и вы даже можете создать свой собственный шрифт с помощью часто используемых значков. Обновления иконок тоже бесплатны!
Добавьте красок в свой дизайн с помощью Stackicons, коллекции из более чем 60 обновленных значков с логотипами брендов; от Dribbble до Reddit. Они добавят индивидуальности вашему стандартному дизайнерскому комплекту. Вы можете выбрать обычные значки, различные округлые варианты или квадратные значки. Здесь каждый найдет что-нибудь для себя!
Если вы ищете невероятных социальных иконок, обратите внимание на Socialicious. Он предоставляет значки социальных сетей в виде шрифта, что делает их невероятно простыми в использовании и еще проще настраивать. Интегрируйте их с помощью одной строчки кода и настраивайте с помощью CSS.
Увлекательные и динамичные, Mono Social — это иконы социальных сетей с веселой индивидуальностью. Вы можете использовать их бесплатно и выбрать один из 3 вариантов презентации (закругленный, круговой, обычный), соответствующий вашему стилю.Используйте athem с CSS, HTML и SCSS. Они бесплатны для личного и коммерческого использования.
Пакет Socialico, созданный Джелио Димитровым, состоит из 74 ярких и привлекательных значков социальных сетей. Они упакованы в виде веб-шрифтов, поэтому каждый символ на клавиатуре создает красивый значок с множеством вариантов представления. Поскольку эти значки шрифтов бесплатны, добавьте их в свой набор инструментов!
Большой список плоских иконок и иконочных шрифтов
Иконочные шрифты потрясающие. За исключением того факта, что они должны быть одноцветными, они лучше, чем использование изображений в качестве значков во всех отношениях. Но что вы выберете? Есть множество различных наборов. Я попытаюсь собрать их всех здесь и постоянно обновлять (этот пост уже обновлялся несколько раз).
Pictos

Номер 600+
Стоимость $ 19–249 $
Pictos — это иконочный шрифт, который действительно популяризировал эту идею.В дополнение к наборам, они также предлагают Pictos Server, службу, которая позволяет вам создать свой собственный набор шрифтов из своей библиотеки значков и будет размещать / обслуживать его для вас. Это позволяет использовать очень маленькие (быструю загрузку) файлы шрифтов и удобный интерфейс для обновления ваших текущих наборов.
Набор символов

Набор символов
уникален тем, что он превращает слова в значки. Напишите слово «сердце» и получите. Это работает через OpenType, типографскую функцию современных браузеров.
Современные пиктограммы

v1 распространяется бесплатно на Font Squirrel.v2 оплачивается вместе с полным набором по цене 25 долларов или отдельными иконками по цене от 0,50 доллара.
Пиктонический

Номер 2586
Стоимость Плата за иконку, или 199 долларов
Pictonic также предлагает размещенную службу значков и предлагает уникальные цены (0,59 доллара США за значок).
StateFace

StateFace имеет все 50 штатов США в виде значка шрифта. Когда они вам нужны, они нужны вам.
Геобатс

GeoBats — это иконка с изображением стран мира.GeoBats находится на DaFont.com, и стоит выполнить поиск по «иконке» там, чтобы увидеть другие бесплатные вещи, которые у них есть.
iconSweets 2

Также имеет бесплатную предшественницу.
Эрлер Дингбатс

Значительное улучшение стандартных дингбатов.
Типограмма

CleanIcons

Метеоконы

По погоде!
Ecqlipse 2

Под ними есть маленькие тени (не совсем «плоские»).Очень маленький предшественник.
Heydings Icons

IcoMoon

Номер 500+
Стоимость Бесплатно — 59 долларов
IcoMoon — это набор иконок с открытым исходным кодом. Но что еще более важно, IcoMoon — это веб-приложение для настройки и загрузки оптимизированных шрифтов значков. Вы выбираете только те значки, которые вам нужны, и загружаете этот свернутый набор. Вы можете легко добавить шрифт из разных наборов или добавить значки из файлов SVG с помощью простого перетаскивания.
Культовый

Gedy Rivera Social

Фонд Иконки

Номер 47 + несколько других мини-наборов
Стоимость Бесплатно
Может использоваться с Zurb Foundation или без нее.
Фико

Моноширинный.
Веб-символы

НаписатьСоциальный

В частности, только иконки социальных сетей.Они заявляют о «миллиардах», что явно не так.
Entypo

ClickBits

Номер ~ 400
Стоимость 12–49 долларов
Набор разных шрифтов в зависимости от типа (например, стрелки, значки, круги и т. Д.)
Шрифт Awesome

Разработан для использования с Twitter Bootstrap. Другими словами, это переработанная версия бесплатной версии Glyphish, с которой она поставляется.
Социальные сети JustVector

Только социальные сети.
PulsarJS

Flexi Social

Только социальные сети.
Рафаэль

Соса

Бесплатно, но они принимают пожертвования на главной странице.
Пиконик

Номер 8 комплектов по 96 штук
Стоимость 29 $ за комплект
Стоимость только иконок в виде графики отличается, но шрифты разбиты на 8 наборов.Похоже, что покупать именно те наборы, которые вам нужны, — заноза в заднице, поскольку они просто измельчены до четных чисел. Если вам нравится набор, вам, вероятно, лучше купить один из наборов.
Дот Ком

Лучше всего достать его из DaFont, а затем запустить через Font Squirrel.
Стедиконы

Также есть Vol. 1 (312 нарисованных от руки иконок) и Vol. 2 (60 миниатюрных произведений искусства), которые являются не шрифтами, а плоскими иконками.
Типиконы

Пожертвования помогают продолжать работу.
Только плоские иконки
Следующие значки не входят в набор @ font-face, а представляют собой плоские векторные значки. Вы можете легко включить их в другие наборы с помощью таких инструментов, как IcoMoon.
Набор веб-иконок

Номер 1,600+
Стоимость 25–99 долларов
У них есть пара небольших наборов наборов, или вы можете стать участником, чтобы получить доступ ко всем из них по цене, меньшей, чем стоимость двух наборов.
Рондо

Социальный значок шрифта.
Геомиконы

Номер 100+
Стоимость 16 $ за комплект
Поставляется в двух наборах: один состоит из твердых фигур, а другой — из штрихов.
Пиконс

Номер 100+
Стоимость 9,90–59 долл. США
Наборы разных размеров и стилей по разной цене, в том числе и неплоские.
Символы

Номер ~ 500
Стоимость 5–43 долл. США 90 441
Один большой набор с парочкой маленьких дополнительных упаковок.
Биксель

Сбор средств, похоже, закончился, но значки все еще продаются. Я считаю, что это только PNG, а не вектор, и я также не уверен, автоматически ли вы получите 40 дополнительных значков пакетов.
Вкладки

Номер 745
Стоимость 10–60 долл. США 90 441
Бесплатные обновления.
Пиксели

Также имеет набор без шрифтов с большим количеством значков, чем входит в набор шрифтов.
Gentleface

Бесплатно, если используется для личных или общественных сайтов.
Глифиш

Номер 400
Стоимость Бесплатно — 25 долларов
Набор из 200 штук одного размера бесплатно или набор из 400 штук двух размеров за 25 долларов.
Глификоны

Номер 350
Стоимость Бесплатно — 49 долларов
Бесплатно для личных и общественных сайтов или платите за бесплатные и другие форматы.
Проект существительного

Номер Зиллион?
Стоимость на значок или бесплатно с указанием авторства
The Noun Project, вероятно, самая большая коллекция иконок. Это не совсем «набор», а, скорее, огромный архив символов. Вы можете скачать их по одному бесплатно, если согласитесь указать автора, или купите символ, чтобы получить его бесплатно. Вам придется объединить их все вместе, чтобы использовать их в качестве шрифта.Вы можете отправить свой собственный.
iconmonstr

Подобно The Noun Project, iconmonstr представляет собой архив значков, в котором вы можете искать и загружать по одному при необходимости.
Партия

Поставляется с PSD, SVG и PNG
Gcons

Открытый исходный код
Пиксельный

Редактировать iPhone UI

Номер 160
Стоимость 69–189 долларов
189 $ дает вам векторный PSD.
Простота

Picas

Номер 250
Стоимость 10–25 долларов
Доступна пара бесплатных пакетов предварительного просмотра.
Гельветиконы

Номер 600+
Стоимость 159–499 долл. США
Эко ИКО

Мэтью Скилз.
Бранкич1979 Иконки

Кутиконы

Автор Vaibhav.
Роуминг Дизайн

Только для личного пользования.
Значок Eden Glyph

Аналогичный набор в виде штрихов вместо сплошных фигур.
UIcons

Версия
@ font-face «скоро» и, скорее всего, будет небольшим набором оригиналов.
Джигсоар

Бесплатно с указанием авторства.
Космо Базовый

Webalys

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

Перекошенные значки

Углерод

Брокколидрия

Шарлотта Свифт. Кажется, что они удалены из Интернета, но живут в некоторых наборах шрифтов значков.
Значок Minia

Автор Egemen Kapusuz.
Силкконс

Автор Vaibhav.
105 петель

Автор Pranav.
Разработчик WPZOOM

Перо

Fontelico

Открытый исходный код и краудсорсинг («мы создадим 1 иконку на каждые 50 долларов»). Часть проекта Fontello.
Picto Foundry Icons

Метриконы

На основе Windows 8.
Pixicon

Иконки Mobile Pro

Стилистика

Номер 115
Стоимость $ 26.20 — 262 долл. США
Pixiconz

Рисованные значки

PictoPro

Каждый набор (контурный или сплошной) стоит 15 долларов или оба по 25 долларов.
Минииконы

Другая информация
Убедитесь, что вы используете их с правильной семантической / доступной разметкой.
Несколько причин, почему шрифты со значками великолепны.
IcoMoon — фантастическое приложение для настройки, сопоставления и создания собственного шрифта значков с использованием всего, что вам нужно.
Fontello использует несколько бесплатных наборов значков шрифтов и позволяет вам выбирать символы и применять сопоставления по своему усмотрению. Подобно IcoMoon — проще, но меньше возможностей.
Иероглиф — Создание шрифта значка из каталога векторных файлов (SVG)
Glyphs — редактор шрифтов для всех.
Иконочные шрифты: 10 лучших иконок для веб-сайтов и инструментов
Во время разработки вашего веб-сайта они, несомненно, понадобились вам: иконки, также называемые иконочными шрифтами.Они бывают всех форм и размеров и часто доступны бесплатно. Чтобы удовлетворить спрос на минималистичный дизайн веб-сайтов, большое предложение стало более или менее необходимостью.
В этом блоге мы представляем обзор шрифтов для иконок, в котором проводится различие между бесплатными и платными вариантами. На некоторых веб-сайтах вам будет предложено ссылаться на источник шрифта значка при размещении его на своем веб-сайте. И это в основном касается бесплатных вариантов.
В большинстве случаев веб-разработчики не считают это удобным, так как это придает веб-странице дилетантский вид.Поэтому мы упомянули в этом случае, нужно ли давать ссылку при использовании шрифта значка.
Продолжение этого блога будет посвящено тому, как лучше всего реализовать шрифты значков на своем веб-сайте и как определить, какие значки подходят.
Наши 10 лучших шрифтов для веб-сайтов и инструментов
Вариант 1: Font-Awesome (бесплатный и платный вариант)
Font-Awesome — один из наиболее широко используемых наборов иконок и инструментов для разработчиков.Самым большим преимуществом Font-Awesome является то, что вы можете выбирать из более чем 7.000 иконок! Значки очень настраиваемые, так как они очень удобны для css. Кроме того, их библиотека упростила добавление значка на ваш веб-сайт, и инструмент также прост в использовании.
Кроме того, в Font-Awesome также можно добавить свои собственные значки.
Вариант 2: IconMoon (бесплатная и платная опции)
В библиотеке IcoMoon имеется более 5000 иконок с открытым исходным кодом.Все значки IcoMoon созданы на основе точной пиксельной сетки, что делает значки привлекательными на любом веб-сайте.
С помощью дополнительной функции «Приложение IcoMoon» вы можете создавать свои собственные пакеты значков и использовать их во многих различных форматах, включая SVG, полимер, PDF, XAML, CSH, шрифт значков с лигатурами или старые добрые PNG / CSS-спрайты. IcoMoon предлагает как бесплатные, так и платные варианты.
Вариант 3: Dashicons (бесплатно)
Dashicons — это официальный иконочный шрифт администратора WordPress от 3.8 и далее. С 2018 года новых значков не создавалось, но есть целый список (более 300 значков) на выбор. Иконки очень совместимы с Gutenberg, стандартным конструктором страниц WordPress.
Вариант 4: Размер байта (бесплатно)
Каждый значок размера байта закодирован вручную по сетке 32 × 32 и использует строку SVG для максимальной гибкости стиля; Это означает, что вы можете настроить вес, цвет, размер и форму значков.
Если ваша цель — создать сверхлегкий веб-сайт, то Bytesize — определенно хороший вариант.Все их 84 иконки весят всего 9 КБ в уменьшенном виде и 2 КБ в SVGZ или Gzip.
Вариант 5: Flaticon (бесплатно)
Хороший вариант для уникальных и забавных иконок — Flaticon. В бесплатной версии вы можете загружать до 10 иконок в день. Иконки весят около 16 Кб каждая. Однако недостатком является то, что если вы используете бесплатную версию, вам придется ссылаться на источник значка на своей веб-странице.
Вариант 6: Fontello (бесплатно)
Fontello — это бесплатный генератор шрифтов для значков, с помощью которого вы можете находить и создавать новые значки.Доступны стандартные значки, но также можно преобразовать векторные изображения в иконочный шрифт. Вы также можете загрузить свои собственные изображения и преобразовать их.
Вариант 7: Магазин бесплатных иконок (бесплатно)
Как и Free Icon Shop, это хороший (бесплатный) вариант для уникальных и красивых иконок. Преимущество этого сайта в том, что нет необходимости указывать источник. Недостатком является то, что на веб-сайте используется реклама, которая мешает вам загрузить значки.
Вариант 8: Iconfinder (бесплатно)
В Iconfinder вы можете выбрать из более чем пяти миллионов иконок! Примерно 319 тысяч из них бесплатны. С помощью функции поиска вы можете указать, ищете ли вы платные или бесплатные значки. Вы также можете указать, хотите ли вы разместить на своем веб-сайте обратную ссылку для пакетов значков, если это необходимо. Таким образом, вы можете фильтровать таким образом, чтобы на веб-сайте отображались только те значки, которые вы можете использовать совершенно бесплатно.
Вариант 9: Envato (часто платный)
В дополнение ко многим другим изображениям, Envato также предлагает значки. Большинство пакетов значков оплачиваются, но у вас есть такой большой выбор на этой платформе, что вам не составит труда найти уникальный набор значков.
Вариант 10: Emojipedia (бесплатно)
Конечно, вы также можете использовать классические значки: смайлики. Их очень легко интегрировать в ваш веб-сайт, и все они находятся в свободном доступе.Они тоже почти ничего не весят.
Так много вариантов на выбор ..
Как вы теперь знаете, существует множество опций, которые могут помочь вам найти идеальный набор иконок. Сообщите нам, какой ваш любимый веб-сайт / инструмент для иконок, в комментарии внизу этого блога.
15+ лучших иконочных шрифтов для веб-дизайна и дизайна пользовательского интерфейса (бесплатно + премиум)
Иконочные шрифты — один из самых полезных элементов, без которого веб-дизайнеры и дизайнеры пользовательского интерфейса просто не могут жить. Сегодня мы представляем вам коллекцию лучших современных и креативных шрифтов для иконок, которые вы можете использовать на своем веб-сайте и в дизайне пользовательского интерфейса.
С иконочными шрифтами вам не нужно полагаться на библиотеки файлов PNG. Вам не нужно изменять размер и редактировать значки с помощью векторных файлов, чтобы они соответствовали дизайну вашего веб-сайта. И, что более важно, вам не нужно беспокоиться об оптимизации значков для различных размеров экрана.
Однако найти правильный шрифт значков, который будет сочетаться с вашими дизайн-проектами, может быть непросто. Мы хотим упростить этот процесс. Начните с просмотра нашей тщательно подобранной коллекции бесплатных и премиальных шрифтов для значков (и обязательно ознакомьтесь с нашими советами по выбору шрифта для значков, которые помогут вам начать работу!)
Icofont — это самый креативный шрифт для иконок, который вы можете загрузить и использовать совершенно бесплатно.Этот шрифт включает более 2100 значков в 30 различных категориях, таких как валюта, социальные сети, фирменные логотипы и т. Д. Одним из преимуществ использования этого пакета является то, что он доступен как в формате SVG, так и в виде значков.
Font Awesome — самый популярный в Интернете иконочный шрифт, содержащий более 7000 иконок. Его используют более 100 миллионов веб-сайтов, включая такие бренды, как McDonalds и Йельский университет. Он содержит множество полезных функций. Самостоятельный хостинг пакета значков — идеальный способ его использования, поскольку облачные планы имеют ограничения на использование.
Ionicons — еще один набор креативных иконок с минималистичным и простым дизайном. Этот значок шрифта разработан специально для разработки веб-интерфейса и мобильного пользовательского интерфейса и совместим с платформами iOS и Android. Всего в нем более 1100 иконок. Он находится под лицензией MIT с открытым исходным кодом
.
Это коллекция уникальных значков с современным минималистским дизайном. Он включает 150 различных значков, которые вы можете использовать в различных дизайнах электронной коммерции. Иконки доступны в форматах EPS, AI, SVG, а также в виде значков со шрифтами.
Этот набор включает смешанную коллекцию полезных значков, связанных с развлечениями, мультимедиа, онлайн-мероприятиями, образом жизни и т. Д. Пакет содержит в общей сложности 130 значков, которые вы можете использовать в качестве шрифта значков или редактировать и настраивать по своему усмотрению с помощью векторных файлов EPS и AI.
Иконки погоды часто используются во многих различных типах веб-дизайна и дизайна пользовательского интерфейса, особенно в мобильных пользовательских интерфейсах. В этом пакете вы можете выбрать один из 42 уникальных значков, связанных с погодой.Иконки также доступны в форматах AI, PSD, SVG и иконок.
Подобно предыдущему набору значков шрифтов, этот пакет содержит набор минимальных значков линий. Он также включает 32 стильных значка погоды в нескольких форматах, включая AI, SVG, EPS и шрифты значков. Благодаря чистому и простому дизайну эти значки подходят для любого делового и профессионального дизайна.
Fontisto — еще один отличный бесплатный иконочный шрифт с набором современных и стильных иконок в нескольких категориях.Значки полностью масштабируемы и отлично смотрятся на дисплеях Retina. Его также можно совершенно бесплатно использовать с коммерческими проектами.
Dripicons — это коллекция линейных иконок с гладким и минималистичным дизайном. Иконки имеют современные макеты, которые подходят как для веб-дизайна, так и для дизайна мобильного пользовательского интерфейса. Его также можно бесплатно использовать в коммерческих проектах.
Typicons поставляется с набором легких и простых значков, которые работают как в веб-интерфейсах, так и в пользовательских интерфейсах собственных приложений. Шрифт включает более 330 уникальных дизайнов значков в нескольких категориях и с масштабируемым дизайном.
Если вы поклонник линейных значков, этот набор современных линейных значков идеально подходит для вас. В нем более 300 иконок. Значки доступны в форматах AI, SVG, PSD, а также включают версию шрифта значков для цифрового дизайна.
Этот премиальный значок шрифта содержит 100 уникальных значков, которые включают в себя все виды символов и рисунков, связанных с транспортом и путешествиями. Он также поставляется в нескольких форматах векторных файлов, а также в формате значков.
Набор из 200 уникальных иконок, созданных специально для образовательных проектов.Этот набор значков поставляется в форматах файлов EPS, AI и SVG. Версия шрифта значка также включена для веб-дизайна и дизайна мобильного пользовательского интерфейса.
Это массивный набор линейных значков с большим разнообразием дизайнов в нескольких категориях. Этот пакет идеально подходит для современного мобильного и веб-дизайна. Значки доступны в векторном формате и формате значков шрифта.
Captain Icon — это современный шрифт с более чем 350 уникальными дизайнами иконок. Иконки идеально подходят для создания как веб-интерфейсов, так и мобильных пользовательских интерфейсов.Иконки бывают разных форматов, включая EPS, SVG, PSD и версии шрифтов значков.
Devicon — это бесплатный иконочный шрифт с дизайном значков с заливкой. В пакете есть много полезных значков, особенно связанных с веб-разработкой и мобильной разработкой. Вы можете использовать облачную версию шрифта значка или самостоятельно размещать на своих серверах.
Entypo — бесплатный иконочный шрифт с минималистичным и чистым дизайном. Этот пакет включает более 400 иконок. Несмотря на то, что шрифт не обновлялся какое-то время, значки актуальны и сегодня.
Этот бесплатный шрифт иконок от Pixelden включает 200 уникальных иконок с тонкими линиями. Дизайн каждого значка вдохновлен iOS 7. Этот шрифт значка больше всего подходит для дизайна веб-сайтов и веб-приложений.
5 советов по выбору шрифта для иконок
Вот несколько советов, которые помогут вам выбрать лучший шрифт для значков для различных типов веб-дизайна и дизайна пользовательского интерфейса.
1. SVG-иконки и иконочные шрифты
По поводу выбора значков SVG и значков шрифтов ведутся споры.Хотя у обоих вариантов есть свои преимущества и недостатки, некоторые дизайнеры предпочитают один другому.
К счастью, большинство шрифтов значков в нашем списке также включают версии значков SVG. Так что мы позволим вам решить, какой вариант подходит для вашего проекта.
2. Убедитесь, что он отзывчивый
Отзывчивость шрифта значка — вероятно, самая важная особенность, на которую нужно обращать внимание при выборе значка любого типа. Здесь также сияют шрифты значков, поскольку они обычно достаточно отзывчивы, чтобы выглядеть одинаково на всех типах экранов и устройств.
Тем не менее, не помешало бы дважды проверить, чтобы значки реагировали, особенно если вы используете версию значков в формате SVG.
3. Выберите подходящие темы
Иконочные шрифты бывают разных стилей и тем. Например, контурные значки, значки с плоским дизайном, минималистичные значки и многое другое. В зависимости от типа проекта, над которым вы работаете, вам решать, как найти правильный шрифт значка с соответствующей темой.
4. Цвета и настройка
Одним из многих преимуществ самостоятельного размещения собственных шрифтов значков является то, что он позволяет настраивать значки по своему усмотрению.Большинство современных шрифтов для значков даже позволяют выбирать из нескольких версий значков, включая версии с заливкой и контуром.
5. Бесплатные и премиальные иконочные шрифты
Конечно, если у вас ограниченный бюджет, бесплатный шрифт — идеальный выбор. Но, если вы можете позволить себе несколько долларов, используйте шрифт премиум-класса. Не только для того, чтобы придать уникальный вид вашему веб-дизайну или дизайну пользовательского интерфейса. Но также иметь полный контроль над иконками и иметь возможность использовать их в коммерческих проектах.
Ознакомьтесь с нашей коллекцией лучших шаблонов целевых веб-сайтов для приложений, чтобы получить преимущество перед дизайном своего веб-сайта.
20 лучших бесплатных иконок для дизайна пользовательского интерфейса
Когда дело доходит до дизайна пользовательского интерфейса, два основных компонента, которые являются важными аспектами любого веб-проекта, — это бесплатные значки и ресурсы. Хотя вы всегда можете создавать свои значки и символы для своих проектов, давайте будем честными — ни у кого из нас нет на это времени.
Вы всегда можете поискать в Интернете и выбрать значки с множества веб-сайтов, потому что, если у вас нет времени на создание, у вас должно быть время для поиска.Нет?
Вздох … ну тогда ладно. Когда вы дизайнер, имея под рукой ресурсы и шрифты, вы можете выполнять свои проекты намного быстрее. Чтобы помочь, мы покопались за вас и составили список из 20 лучших бесплатных шрифтов для иконок для дизайна пользовательского интерфейса, чтобы вы могли создать набор ресурсов, который вы сможете использовать на долгие годы.
Итак, если вы готовы начать работу, давайте продолжим!
20 лучших бесплатных иконок для дизайна пользовательского интерфейса
Иконочные шрифты — это шрифты, содержащие символы и глифы, а не буквы или цифры.Они довольно популярны среди веб-дизайнеров. В этом посте мы перечисляем некоторые из лучших шрифтов для иконок для дизайна пользовательского интерфейса. Хорошо то, что все эти шрифты со значками доступны бесплатно. Да, вы правильно прочитали! Дамы и господа, вот 20 лучших бесплатных шрифтов для дизайна пользовательского интерфейса.
20 лучших бесплатных иконок для дизайна пользовательского интерфейса
Набор иконок Trendy Thin Line Icon для Интернета и мобильных устройств
Хотите ли вы создавать значки, календари, этикетки, упаковку или любой другой дизайн — шрифт Trendy Thin Line Icon Kit для Интернета и мобильных устройств от fet — лучший вариант, который идеально впишется практически в любой модный дизайн.100% векторный шрифт, он полностью редактируется в Adobe Illustrator. Еще одна интересная особенность этого шрифта — все элементы шрифта наложены друг на друга и хорошо организованы.

НЕОГРАНИЧЕННАЯ ЗАГРУЗКА : Загрузите более 50 миллионов шрифтов, бесплатных подарков и дизайна. Ресурсы
Иконки Themify
Вдохновленный Apple iOS 7, Themify состоит из более чем 320 пиктограмм, созданных вручную с точностью до пикселя. Идеально подходит для использования в веб-дизайне и приложениях, Themify поставляется с широким набором значков и является обязательным инструментом для веб-дизайнеров и разработчиков.Если вы ищете значки, которые идеально подходят для любого проекта, личного или коммерческого, вам следует обратить внимание на значки от Themify.
Pictypo
Pictypo — это дизайнерский шрифт дингбата, созданный Майклом Парсоном. Этот элегантно оформленный шрифт сочетает в себе закругленный стиль с нормальным интервалом, который можно оптимизировать для больших размеров и размеров плакатов, и поставляется с широким спектром символов и обычных стрелок, которые находят отличное конечное применение в офисных значках или транспортных средствах.
Значок Ремикс
Remix Icon — это система с открытым исходным кодом, выполненная в нейтральном стиле. Это идеальный шрифт для дизайнеров и разработчиков, который может использовать их в своих пользовательских интерфейсах. Состоящий из более чем 2200 значков, каждый из них был идеально продуман, с единообразием, удобочитаемостью и идеальными пикселями. Созданные Remix Design, значки имеют вид контуров и заполняются стилями в сетке. Универсальность значков ремиксов позволяет использовать их по своему усмотрению для любых личных и коммерческих нужд.
Иконки векторные линии и шрифт
Иногда иметь слишком много чего-то — это хорошо. Набор векторных линейных значков и шрифтов включает 130 векторных линейных значков, совместимых с Affinity, Affinity Designer и Adobe Illustrator, и предоставляет вам варианты в нескольких форматах, включая AI, PDF, EPS, AFDESIGN и SVG. Вы также получаете пакет шрифтов значков, который включает файлы TTF, SVG, EOT и WOFF.
Шрифты Wirebet
Доступный с обычным интервалом шрифт Wirebet отлично подходит для создания проектов визуализации или презентаций веб-концепций с использованием графического программного обеспечения или без него.Шрифт можно оптимизировать как для обычного текста, так и для настроек отображения большего размера. Шрифт Wirebet также может служить каркасом, или вы можете просто использовать значки в визуализациях или выделять определенные элементы веб-дизайна, что только помогает повысить его универсальность.
Зондиконс
Набор премиальных SVG-иконок, Zondicons, созданный Стивом Шогером, представляет собой сложный шрифт, который идеально подходит для всех, кто хочет создавать цифровые продукты.Этот шрифт, сочетающий харизму и чистую геометрию, был разработан как идеальный вариант с такими функциями, как разборчивость, согласованность и масштабируемость. Благодаря четким краям и гладким углам шрифт помогает сохранять микротекст при использовании. Идеальный выбор для любого пользовательского интерфейса, включая игровые приложения, корпоративные веб-сайты и многое другое.
Шрифты Foundation Icon 3
Набор Foundation Icon Fonts 3, разработанный ZURB, с настраиваемой коллекцией из более чем 275 значков, позволяет настраивать размер, цвет и даже стиль с помощью CSS.Набор, хранящийся в удобном веб-шрифте, является прекрасным примером чистой геометрии. Это в значительной степени связано с тем, что каждый значок был создан в общих формах, таких как треугольники, квадраты, круги и прямоугольники. Благодаря таким функциям, как закругленные углы, толстые линии, а также полная масштабируемость, которая позволяет помещать его в маленькие и большие размеры, набор Fonts 3 идеально подходит для любого проекта
.
Linea Иконки
Набор иконок Linea включает такие категории, как базовые, музыкальные и другие значки, всего более 750 значков, которые вы можете использовать в своих проектах.В набор входят значки во многих различных форматах, включая SVG, шрифт значков и PNG64.
Каркасные значки
Набор иконок Wireframe, состоящий из более чем 200 линейных иконок, является идеальным вариантом для создания каркасов. Набор, совместимый с Adobe Photoshop, Illustrator и другими, включает значки в форматах AI, PDF, PSD и SVG, любой из которых может идеально подойти для любого проекта, над которым вы работаете.
мкм
Разработанный специально для пользовательского интерфейса и состоящий из более чем 100 значков, набор Micron имеет все основные стили глифов, которые, вероятно, будут использоваться почти в 99% проектов.Каждый значок в этом шрифте разработан с максимальной согласованностью и построен на сетке из 512 единиц и разделен на 16 × 16 ячеек. Его лигатуры придают уникальность и работают в обоих направлениях. Вы также получите шпаргалку, которую можно использовать для быстрого ознакомления.
77 Essential Icons
Разработанный Брином Тейлором, этот шрифт поставляется с пакетом из 77 бесплатных основных значков. Вы можете найти значки в форматах AI, PDF, PSD, PNG и SVG. Используя шрифт, вы можете легко изменить цвет любого значка.Этот шрифт с идеальной точностью до пикселей поставляется с бесконечно масштабируемыми векторами, которые можно использовать для любых личных и коммерческих целей.
Line Flat шрифт + плоский значок линии
Созданный на основе идеи плоского стиля линии, этот изящно стилизованный шрифт может быть оптимизирован для настройки дисплея и плаката. Отличный вариант для использования в плакатах, открытках и этикетках. Шрифт идеально подходит практически для любой инфографики и линейных значков. Шрифт поставляется с набором из 26 значков, относящихся к бизнес-темам и многому другому.PSD-файл поставляется с прозрачным фоном и многослойными смарт-объектами, которые можно легко редактировать в Illustrator всего двумя щелчками мыши.
Коллекция искусных шрифтов (24 шрифта)
Crafty Font принадлежит к семейству шрифтов без засечек. Он имеет нормальный моноширинный, сжатый и расширенный интервал, поэтому он идеально подходит для использования в различных конструкциях. В нем есть коллекция из 24 шрифтов, таких как обычный, контурный, в горошек, шеврон, каракули, звезды и другие, которые вы можете оптимизировать для любого размера.Совместим со многими приложениями, включая Photoshop, Illustrator и даже Microsoft Word.
80 мини-иконок (PSD + шрифт Icon)
Доступный как в формате PSD, так и в формате Icon Font, набор из 80 мини-иконок был создан шведским дизайнером Виктором Эриксоном и состоит из идеальных мини-иконок с разрешением 80 пикселей, которые вы можете использовать в любом дизайнерском проекте, в том числе в пользовательском интерфейсе.
150 обведенных значков — PSD AI SVG Webfont
Созданные Дарио Фернандо 150 обведенных значков — PSD AI SVG Webfont — это простой, но полезный набор значков, включающий PSD, AI, нарезанные форматы SVG.Если вы ищете идеальный значок для веб-сайта, вам стоит обратить внимание на этот шрифт.
Иконки погоды
Шрифт Weather Icons, состоящий из более чем 200 значков погоды в виде значков и стилей CSS, был создан для проектов с темой погоды. Независимо от того, нужны ли вашему проекту высококачественные значки погоды, значки морской тематики или значки метеорологии, это лучший вариант практически для любой темы погоды. Предлагает встроенный API, который совместим с Yahoo Weather, Всемирной метеорологической организацией, OpenWeatherMaps и другими популярными погодными приложениями.
Специальные значки в этом наборе значков включают около 28 фаз Луны и 12 часов на часах. Значки поставляются с файлами OTT и TTF, которые можно легко использовать в дизайнерских приложениях, таких как Photoshop, Illustrator и Sketch. Еще одна интересная особенность этого шрифта — это свобода использования его стиля CSS, который помогает масштабировать, вращать, переворачивать, добавлять тени и даже изменять цвета значков.
Бесплатные Иконки Шрифт
Free Icon Set — это готовый к сетчатке шрифт и легко стилизуемый шрифт.Обладая высокой масштабируемостью и возможностями настройки, шрифт хорошо подходит для разработки практически любого проекта, от личного до коммерческого.
Captain Icon — 350 бесплатных векторных иконок
Если вы хотите создавать невероятные мобильные и веб-дизайны, тогда вам стоит обратить внимание на шрифт Captain Icon. Шрифт Captain Icon с более чем 350 векторными значками, которые можно оптимизировать до любого размера без потери качества, доступен в форматах EPS, PSD, PNG, SVG и веб-шрифтов.Это идеальный выбор для использования в широком диапазоне категорий, таких как дизайн, спорт, социальные сети, офис, погода и многое другое.
Набор иконок MFG Labs
Этот готовый к сетчатке глаза шрифт состоит из векторов, и его можно легко встроить на веб-сайт или в приложение с помощью Webfont и CSS.

Номер	600+
Стоимость	$ 19–249 $

Номер	2586
Стоимость	Плата за иконку, или 199 долларов

Номер	500+
Стоимость	Бесплатно — 59 долларов

Номер	47 + несколько других мини-наборов
Стоимость	Бесплатно

Номер	~ 400
Стоимость	12–49 долларов

Номер	8 комплектов по 96 штук
Стоимость	29 $ за комплект

Номер	1,600+
Стоимость	25–99 долларов

Номер	100+
Стоимость	16 $ за комплект

Номер	100+
Стоимость	9,90–59 долл. США

Номер	~ 500
Стоимость	5–43 долл. США 90 441

Номер	745
Стоимость	10–60 долл. США 90 441

Номер	400
Стоимость	Бесплатно — 25 долларов

Номер	350
Стоимость	Бесплатно — 49 долларов

Номер	Зиллион?
Стоимость	на значок или бесплатно с указанием авторства

Номер	160
Стоимость	69–189 долларов

Номер	250
Стоимость	10–25 долларов

Номер	600+
Стоимость	159–499 долл. США

Номер	115
Стоимость	$ 26.20 — 262 долл. США

Comments

Leave Comment