Pixelgene - Ресурсы для веб-дизайнеров. Freebies. Журнал о веб-дизайне

Подборки свежих freebies, мокапы(mock-up), шрифты, иконки, psd, wordpress, статьи о веб-дизайне, лайвхаки для дизайнеров.

  • Freebies
  • Шрифты
  • Статьи
  • WordPress

Подписка

Тэги #

3D AI App Background Branding CSS e-commerce Font Framework HTML Icons JS Landing Mock-up Patterns PSD Retro SVG UI WordPress Веб-сервис Портфолио Статья Тема Типографика Урок Шрифт

Iconmonstr. Бесплатный сервис качественных иконок

09.01.2014 Leave a Comment

iconmonstr-logo

Привет всем читателям Pixelgene! Сегодня я расскажу про бесплатный сервис на котором можно не только скачать но и генерировать в нужном виде иконки для сайта и не только. Сервис как вы могли уже догадаться по названию статьи называется Iconmonstr и основан он в германии которая славится своими мастерами иконок(к примеру iconwerk).


iconmanstr-menuИ так попадая на сервис мы можем воспользоваться поиском по названию, сделать рандомную выборку(кнопка справа с двумя переплетающимися стрелками), просмотреть самые популярные иконки которые скачивали до этого(кнопка с сердечком) или искать иконки по разделам нажав на кнопку с тремя полосками(что очень удобно). Допустим если вам нужны соц-сети мы просто кликаем на раздел Social. Но это еще не все… Допустим нам нужна иконка Dribbble(я выбрал без полей, но есть еще несколько разных вариантов с полями). После выбора нужной иконки кликаем на нее и попадаем на страницу с превью где можно посмотреть как она будет смотреться в самых популярных размерах. Если нам подходит иконка в популярном размере(в пикселах), а это — 16, 24, 32, 48, 64, 128, 256, то тогда можем смело выбирать ниже формат файла PNG, если нет и нам нужен строго свой размер тогда выбираем SVG которое прийдется потом масштабировать и менять цвет в векторном редакторе. И так допустим нам нужен размер 256px жмем снизу PNG после ставим галочку что мы ознакомились с правами на использование затем нажимаем на большую стрелку вниз.

iconmonstr-sizes

После чего попадаем на страницу с параметрами где сверху(слева на право):
1.Ползунок где мы выбираем размер иконки(считается от полей если они есть)
2.Ползунок размера отступа от внешней границы до самой иконки.
3.Цвет иконки(можно ввести значение в HEX).
Следующие значения нужны как правило если вы выбрали иконку без полей то вы можете добавить их здесь.
4.Цвет полей
5.Форма поля(квадрат, круг, кольцо)
Ниже мы можем выбрать общий фон страницы на котором будет использоваться иконка(черный и белый).

iconmonstr-final

После чего опять нажимаем на большую стрелку вниз и получаем нашу иконку.

Filed Under: Freebies, Статьи Tagged With: Icons, SVG, Веб-сервис

Понравилось? Поделись!

Популярно

Шрифт Proxima Nova Cyrilic

Шрифт Proxima Nova Cyrilic

Subtle Patterns. Библиотека бесшовных паттернов

Subtle Patterns. Библиотека бесшовных паттернов

Nord — декоративный шрифт с поддержкой кириллицы

Nord — декоративный шрифт с поддержкой кириллицы