Создать иконки онлайн: Пиктограммы | Создание иконки онлайн

Редактор иконок SVG — онлайн и бесплатно

PhotoRetrica

Выберите редактор

App 1App 2App 3 На весь экран

Как редактировать значок SVG

1

Выберите приложение

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

2

Следуйте шагам

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

3

Наслаждайтесь результатом

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

Почему SVG идеально подходит для создания иконок

Адаптивный дизайн — популярная тема. Экраны давно вышли за рамки стандартных разрешений, и сайты можно просматривать как на устройствах размером с ладонь, так и на больших мониторах. Сайт должен выглядеть одинаково независимо от размера устройства и плотности пикселей. Существует множество различных техник и технологий для адаптации дизайна и контента. Векторная графика, SVG, на мой взгляд, одна из самых интересных тем в этом направлении. Графические значки — ключевой элемент практически любого веб-сайта или приложения. Как правило, они немного весят, но вопрос выбора формата все равно остается актуальным. Помимо стандартных форматов изображений, у разработчиков есть два основных варианта: использовать SVG или иконочные шрифты. Что лучше? Давайте разберемся ниже.

Сайт должен выглядеть одинаково независимо от размера устройства и плотности пикселей. Этого можно добиться с помощью формата векторной графики — SVG. SVG отлично подходит для иконок. Хороший выбор для начинающих и продвинутых пользователей SVG. Интерфейс аккуратный и не загроможден множеством инструментов, которые вы не будете использовать. Редактор хорошо подходит для тех, кто плохо знаком с векторной иллюстрацией. Пользователь не должен теряться среди инструментов, которым непонятно, для чего они используются. Он содержит весь базовый набор для создания обычного изображения: формы, текст, слои, тени, рамки, фон и т. Д. Он не может сравниться с полноценным настольным редактором, но его более чем достаточно для быстрого дизайна и редактирования. Вы можете создать изображение с нуля или загрузить уже существующее.

Другие редакторы и инструменты

Редактор экспозиции

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

Открыть приложение

Редактор яркости изображения

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

Открыть приложение

Изменить контраст

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

Открыть приложение

Резкость изображения

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

Открыть приложение

Фильтры Instagram

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

Открыть приложение

Редактор иконок

Редактируйте свои SVG-иконки бесплатно с помощью нашего мощного инструмента. Бесплатно меняйте цвет целого или отдельных элементов, вращайте, кадрируйте, меняйте фон и многое другое.

Открыть приложение

Удалить фон

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

Открыть приложение

Генератор счетов

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

Открыть приложение

Вам нравится PhotoRetrica? Помогите нам расти!

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

Как создать иконки для приложений на Android и iOS

Иконка приложения для Android

1.

Приложения для Android разрабатываются с учетом размера устройства и разрешения экрана.

Графика и разметка в приложениях измеряются в единицах — DPI (количество точек на дюйм).

2. Категории DPI

• Low DPI (LDPI) = 120DPI
• Medium DPI (MDPI) = 160DPI
• High DPI (HDPI) = 240DPI (Nexus S, SGS2)
• Extra High DPI (XHDPI) = 320DPI (Galaxy Nexus, Nexus 4, SGS3)
• Extra Extra High DPI (XXHDPI) = 480DPI (HTC One и SGS4)

Размер и формат иконок запуска приложения (launcher icon) для Android

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

Главное:

Иконка запуска приложения должна быть 32-битной, в формате PNGs с альфа-каналом (с прозрачным фоном).

Базовый размер — 48dp, с краями 1dp — для низкого разрешения. Чем выше плотность пикселей экрана (DPI), тем больше отображается деталей. Для остальных разрешений нужно увеличить масштаб на 400% 192 x 192 dp (с краями 4dp).

Хотите идеальную иконку для любого разрешения и не ищете легких путей? Сделайте несколько иконок разных размеров для всех вариантов разрешений, воспользовавшись таблицей ниже. Можно включить дополнительные значения для последовательного увеличения размеров. Например, иконки 96 x 96 пикселей xhdpi могут содержать промежуточный размер 88 x 88 пикселей с отступами в 4 пикселя с каждой стороны. Отступы образуют легкую тень и гарантируют четкость иконки на любом фоне.

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

Иконки приложения для публикации на Google Play

Иконка приложения для публикации в Google Play должна быть 512 x 512 пикселей, с высоким разрешением.

Эта иконка используется только для Google Play и не заменяет иконку запуска приложения (launcher icon). Иконка публикации на Google Play должна содержать тот же контент, что и иконка запуска приложения, за исключением некоторых идентификационных знаков.

Раздел “Рекомендуемые”

В разделе «Рекомендуемые» можно продемонстрировать потенциальным пользователям графические возможности приложения. 

Требования к иконке в разделе «Рекомендуемые» :

• JPEG или 24-битный PNG (без альфа-канала)
• 1024 х 500 пикселей

Расположение

Картинка для раздела «Рекомендуемые» располагается над сведениями о приложении в Play Маркете. Если загружен проморолик, поверх нее будет расположена кнопка «Воспроизвести».

Советы

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

Цели иконки приложения

У иконки приложения есть 3 основных цели:

1. Продвижение бренда, рассказ о цели приложения.
2. Помощь пользователю в поиске приложения в Google Play.  
3. Функция запуска.

Продвижение бренда

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

Образцы иконок приложений.

Помогите пользователю найти приложение в Google Play

Иконка должна привлекать внимание пользователя во время скроллинга. Качественный дизайн иконки — однозначный сигнал, о том, что Ваше приложение такого же высокого качества.

Для разработки иконки приложения лучше обратиться к дизайнеру.

Правила дизайна иконки для Android

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

Для 3D-иконки:

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

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

Правильно и неправильно

Иконка для приложения на iOS

Размеры 

У каждого приложения должна быть маленькая и большая иконка. Маленькая иконка используется на домашнем экране и в системе после установки. Большая иконка нужна для App Store.

Устройство или контекст

Размер иконки

iPhone 6s Plus и выше, iPhone 6 Plus и выше

180x180px

iPhone 6s и выше, iPhone 6 и выше, 
iPhone SE и выше

120x120px

iPad Pro

167x167px

iPad, iPad mini

152x152px

App Store

1024x1024px

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

Также маленькие иконки нужны для показа:

• в поиске Spotlight,
• в приложении настроек смартфона.

Если у вас нет маленьких иконок, iOS уменьшит главную иконку приложения для показа в этих директориях.

Устройство

Размер иконок 
в поиске Spotlight

Размер иконки настроек

iPhone 6s Plus и выше, 
iPhone 6 Plus и выше

120x120px

87x87px

iPhone 6s и выше, iPhone 6 и выше, 
iPhone SE и выше

80x80px

58x58px

iPad Pro, iPad, iPad mini

80x80px

58x58px

Внимание:

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

Правила дизайна иконки для iOS:

Подкупающая простота

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

Четкий фокус

Создайте иконку с четким фокусом, который привлекает внимание и идентифицирует приложение.

Узнаваемость

Никто не будет анализировать иконку, чтобы понять ее значение.

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

Без прозрачности, простой фон

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

Без надписей

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

Без фото, скриншотов и элементов интерфейса

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

Без точных копий продуктов Apple

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

Не помещайте повсюду в интерфейсе иконку приложения

Пользователя может сбить с толку иконка приложения, встречающаяся повсюду в интерфейсе. Просто используйте цветовую схему иконки в интерфейсе. См. Цвет.

Протестируйте иконку на разных обоях

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

Сохраняйте углы иконки квадратными

Система округляет углы иконки автоматически.

Вот и все! Желаем удачи и много красивых иконок для ваших приложений.

Бесплатный конструктор иконок | Создайте собственный значок с помощью инструмента HubSpot

Что такое значок?

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

Например, значок HubSpot представляет собой оранжевую букву «О» с тремя линиями, указывающими в трех разных направлениях. Говорят, что этот символ выглядит как звездочка, часть цепи или зубчатое колесо. Значок выглядит современно — и когда люди его видят, он ассоциируется у них с технологической компанией.

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

Создавайте собственные значки с помощью бесплатного конструктора значков веб-сайтов HubSpot.

Создание значков без установки инструмента для создания значков

Произведите впечатление на посетителей и увеличьте рейтинг кликов с помощью пользовательского значка. Создатель пользовательских значков HubSpot позволяет создавать и загружать значки без установки программного обеспечения для дизайна.

Просто откройте браузер и начните создавать бесплатные иконки для своего веб-сайта и профилей в социальных сетях.

Бесплатные значки повышают узнаваемость бренда

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

Позаботьтесь о своем брендинге. Выберите один из тысяч настраиваемых шаблонов, чтобы создать собственный загружаемый дизайн.

Экспорт бесплатных значков SVG за считанные минуты

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

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

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

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

• Значок веб-сайта называется фавикон. Вы можете добавить его на свой сайт, сохранив файл изображения значка в каталоге вашего сайта.

  Фавиконы имеют формат ICO, но большинство веб-сайтов используют формат PNG, поскольку он более широко распространен и имеет меньший размер файла.

  Системы управления контентом, такие как HubSpot CMS, также позволяют добавлять значки веб-сайтов без HTML-кодирования.

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

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

  Если у вас нет логотипа бренда, генератор комплектов брендов HubSpot поможет вам его создать. Просто введите отрасль, название и слоган вашего бизнеса, чтобы получить персонализированные рекомендации по логотипу.

  Затем вы можете легко интегрировать активы вашего набора брендов в CMS HubSpot.

   

• Да, вы можете сразу загрузить свои значки после их создания с помощью создателя значков веб-сайта HubSpot.

• При создании значка помните о следующих советах:

  • Сделайте свои значки узнаваемыми . Они бывают небольших размеров, поэтому они должны быть легко идентифицируемыми и высокого качества.
  • Рассмотрим цветовую схему . Использование цветов с достаточным контрастом помогает с доступностью.
  • Минималистский подход . Сделайте свой дизайн простым. Если вы используете текст, сократите его количество до нескольких символов. Цель состоит в том, чтобы выделить ваш значок, но не отвлекать пользователей.

Venngage Free Icon Maker — Пользовательские иконки для вашего бренда

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

Лучший дизайн, лучшая узнаваемость бренда: создавайте значки, отражающие ваш бренд

Вы никогда не разочаровываетесь, имея идеально фирменный дизайн, за исключением — вы знаете — 9?0099 иконки ?

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

Потому что с помощью бесплатного онлайн-конструктора иконок Venngage вы вытащите себя из трясины скучных иконок, не соответствующих торговой марке.

Выбирайте из более чем 40 000 значков и иллюстраций и применяйте фирменные цвета к любым одноцветным значкам, которые вы хотите для своего дизайна, всего одним щелчком мыши с помощью Icon Maker от Venngage.

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

НАЧНИТЕ БЕСПЛАТНО

Как создать значок с помощью Venngage Icon Maker:

1. Зарегистрируйте БЕСПЛАТНУЮ учетную запись Venngage, указав свой адрес электронной почты, Facebook или Gmail
2. Выберите шаблон из сотен профессиональных шаблонов или используйте чистый холст
3. Выбирайте из более чем 40 000 значков и иллюстраций
4. Настройте свои значки: измените их цвет, размер, форму, чтобы они отражали ваш бренд, или сгруппируйте значки вместе, чтобы создать новые
5. Поделитесь новыми значками брендов с членами вашей команды для более легкого доступа в будущем

Создание незабываемых фирменных значков:

Выберите из нашей библиотеки значков и иллюстраций

Мы предлагаем более 40 000 значков и иллюстраций для удовлетворения любых ваших потребностей в дизайне.

Применение тонов кожи к различным значкам

Меняйте оттенки кожи для наших разнообразных значков, чтобы они отражали вашу разнообразную аудиторию.

Применение цветов бренда к значкам

Наш бесплатный редактор значков позволяет легко применить цвета вашего бренда к значкам одним щелчком мыши.

Сотрудничайте со своей командой

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

Брендируйте свой дизайн одним щелчком мыши

Пользователь Venngage Business может легко загрузить свои фирменные цвета, логотипы и шрифты в My Brand Kit, а затем применить эти элементы брендинга к своему дизайну одним щелчком мыши.

И знаете что? Это работает и с иконками!

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

Мгновенная замена значка или загрузка значка

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

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

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

Разнообразные иконки для разной аудитории

Ваши иконки должны отражать ваш бренд, и вашу аудиторию.

Скажите своей аудитории, что вы видите их, используя различные значки в своем дизайне.

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

Создание значков во время совместной работы с вашей командой

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

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

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

Сохраните свои значки для более легкого доступа в будущем

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

Любой, кто хочет использовать значки, может сделать копию шаблона коллекции значков и получить доступ к значкам оттуда.

Да, последовательный брендинг — это так просто.

Часто задаваемые вопросы о программе Icon Maker

Какая программа для создания иконок самая лучшая?

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