77 бесплатных инструментов для графического оформления сайта
![](http://etalon-it.bigcdn.ru/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-bfed507-780x470.png)
Важный момент в создании имиджа бизнеса — графическое оформление сайта. Даже если веб-мастер не развивает бренд, на сайте все равно есть изображение, выполняющее роль логотипа — хотя бы чтобы вести по клику на главную.
Мы составили подборку бесплатных или условно бесплатных сервисов для работы с графикой и дизайном на сайте. Сначала собрали большой список, а потом решили удалить явных аутсайдеров и оставили только сайты, достойные внимания. Такие сервисы все равно не могут конкурировать с хорошим дизайнером, но зато позволяют сэкономить деньги и время на первых порах.
В статье:
-
Создание логотипов
-
Графические редакторы для изображений
-
Оптимизация картинок и gif
-
Дизайн сайта
-
Фотостоки
-
Бесплатные иконки
-
Подбор цветов
-
Подбор шрифтов
Инструменты для создания логотипа
Canva — простой редактор для создания логотипов, листовок, баннеров для соцсетей, редактирования изображений и других элементов. Есть бесплатный режим использования с ограниченным выбором элементов для дизайна, и расширенный платный.
GraphicSprings — простые лого можно собирать из разных тематических клипартов и элементов. Скачать готовый файл можно платно от $19.99.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-1b916d3.png)
Logoshi — вводите название и слоган по желанию, выбираете цветовую гамму, а инструмент предлагает варианты. Лучше справляется с латиницей. Скачивание стоит $5 или $20 в зависимости от нужных форматов.
![редактор логотипов онлайн](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-f96e626.png)
Logogarden — конструктор логотипов с помощью готовых клипартов и текста. В маленьком размере картинку можно скачать бесплатно, а пакет с большими размерами и правами на товарный знак стоит $12.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-22e0d7f.png)
Logomaster — русскоязычный сервис для полуавтоматического конструирования логотипов. Скачать можно платно — 1400 рублей базовый большой файл для размещения в сети, дороже — файлы больше, подходящие, к примеру, для печати, несколько вариантов лого и прочие бонусы.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-4c4d68d.png)
Logoza — русскоязычный сервис для создания лого с помощью большого выбора цветных и графичных клипартов. Скачать PNG можно бесплатно, полный набор с PNG в хорошем качестве с прозрачностью, фавиконом для сайта, PDF-документом, мокапом и файлом шрифта стоит 250 рублей.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-0fe9fd3.png)
Logaster — быстрое создание логотипов от отечественного разработчика, есть первичные настройки с выбором вида логотипа, тематики и цветовой гаммы. маленький можно скачать бесплатно, большие файлы только по платным тарифам от 599 рублей.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-abeea60.png)
Turbologo — русскоязычный конструктор логотипов с предварительными настройками и выбором из готовых вариантов. Купить большой файл будет стоить 790 рублей.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-689edff.png)
Renderforest — похожий конструктор лого, предлагает немного вариантов, но довольно красивых, их можно слегка доработать под себя. Небольшой файл для некоммерческого использования можно скачать бесплатно, платные тарифы с большими файлами и лицензией начинаются от 499 рублей.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-f0a61d4.png)
Logo maker от Wix — конструктор от платформы для создания сайтов, позволяет настроить рекомендации по тематике и предпочтениям, выбрать готовый лого и отредактировать его. Бесплатного тарифа нет, пакет файлов в высоком разрешении с правами на использование стоит 1500 рублей, есть спецтарифы для тех, кто собирается делать сайт на Wix.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-b5b055a.png)
Logomakr — сервис с возможностью составить логотип из клипартов и текста. Маленький файл скачать можно бесплатно, пакет больших с лицензией стоит $19.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-8ba79a9.png)
Onlinelogomaker — конструктор без готовых решений, делать логотип можно с нуля с помощью комбинирования и изменений клипартов и текста. С кириллицей работать не умеет. Готовый логотип для коммерческого использования можно скачать за 29$, маленький для некоммерческого бесплатно.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-a77de73.png)
Tailorbrands — сервис для автоматизированного создания логотипов по простым пользовательским настройкам: можно выбрать цвет и тип готового изображения. Тарифы с подпиской на месяц начинаются от $9.99.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-6c91b8f.png)
Графические редакторы для изображений и инфографики
Canva — позволяет редактировать изображения для соцсетей, делать инфографику, флаеры, сторисы и другие элементы. Есть бесплатный и платный расширенный режимы.
Easel.ly — создание инфографик с нуля или на основе шаблонов и коллекции иконок.
Pixlr — фоторедактор прямо в браузере позволяет кадрировать изображения, вырезать фон, работать с цветами и накладывать эффекты.
Sumopaint — похожий онлайн-инструмент для редактирования изображений без Photoshop.
Fotor — редактор изображений со стандартными функциями, дополнительно есть несколько бьюти-инструментов для обработки кожи, наложения макияжа.
Online-fotoshop — простой редактор изображений онлайн, можно кадрировать, делать цветокоррекцию, объединять изображения и накладывать фильтры.
Online-image-editor — бесплатный стандартный редактор, который ко всему прочему работает с gif.
Editor.pho — фоторедактор с функциями ретуши лица и быстрой коррекции изображений.
PixBuilder Studio — редактор растровой графики, позволяющий создавать и web-графику.
Social Image Resizer Tool — кадрирование изображений для социальных сетей.
Meme Generator, Iloveimg, Risovach, Mr-mem, 1001mem — генераторы мемов онлайн.
Сервисы для оптимизации и сжатия изображений и gif
TinyJPG | TinyPNG — инструмент для сжатия изображений в формате PNG и JPEG.
Compressor — позволяет сжать JPEG, PNG, GIF и SVG-файлы с уменьшением объема до 90%.
Compressnow — сжатие изображений с пользовательскими настройками процента сжатия.
Kraken — оптимизирует изображения с потерями и без потерь, чтобы повысить скорость работы сайта.
OptimiZilla — позволяет сжимать изображения пачками.
Image Optimizer — изменяет размер, сжимает и оптимизирует изображения.
Imagify — еще один инструмент для сжатия картинок бесплатно.
Ezgif — сервис для редактирования анимаций позволяет сжимать, уменьшать, обрезать и делать гифки из картинок.
Сервисы для дизайна сайта
Подборка CSS-элементов — несколько интересных решения для навигации и дизайна: кнопок, меню, календарей, комментариев и прочего, рядом с элементом есть код для копирования.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-c538550.png)
CodyHouse Framework — библиотека интерфейсных компонентов HTML, CSS, JavaScript, позволяют настроить фон, кнопки, навигацию и другие функции. Все адаптированы под мобильные. Можно скопировать код CSS, HTML или JS.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-4980da1.png)
Freebbble — бесплатные элементы дизайна из Dribbble: иконки, мокапы, паттерны, кнопки, шрифты.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-bbf910a.png)
Dribbble — тоже подборки бесплатных элементов для дизайна: иконок, меню, персонажей, мокапов и других.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-e6643d0.png)
Free Section of Creative Market — пополнение набора бесплатных работ каждый понедельник.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-abdfe26.png)
Фотостоки
Stock Up — стоковые фото с разных сайтов собраны в одном месте.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-5be6f44.png)
Pexels — красочные бесплатные фото на одном ресурсе.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-2ef31ff.png)
Mazwai — хорошая подборка не только фото, но и видеоклипов и футажей.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-63da7ef.png)
Foodie’s Feed — бесплатные фото еды в хорошем качестве.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-9385c88.png)
All The Free Stock — стоковые изображения, иллюстрации, иконки и видео.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-527a93e.png)
Jéshoots — стильные фото с бесплатной лицензией.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-c9bebe0.png)
Pixabay — бесплатные фотографии, иллюстрации и векторная графика с лицензией на бесплатное коммерческое использование.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-d58867d.png)
Unsplash — фотосток с качественными изображениями от фотографов, можно бесплатно скачивать в большом размере.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-fd1edc1.png)
Styled Stock — сток с бесплатными фото том числе для коммерческого использования, многие подходят как фоны для мокапов или постов в соцсетях. Искать фото удобно по категориям и цветовой гамме.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-e695754.png)
Picjumbo — сток с фотографиями для бесплатного использования в коммерческих целях, скачиваются в большом размере.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-4625fe5.png)
Сервисы с бесплатными иконками
Freepik — в поиске можно найти бесплатные иконки, есть удобные фильтры для поиска.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-6d77307.png)
Pixel Buddha — по поиску можно найти бесплатные иконки для скачивания и использования.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-f668482.png)
Freebbble — подборки бесплатных элементов дизайна, часто попадаются иконки.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-c85fad0.png)
Flat Icon — поиск по 16000+ векторным иконкам.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-99b8de1.png)
Material Design Icons — 750 бесплатных иконок от компании Google.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-4aa233a.png)
Icon Sweets — подборка бесплатных векторных иконок для Photoshop.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-4cb34ae.png)
The Noun Project — большой выбор иконок от разных дизайнеров.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-e1c3f32.png)
Endless Icons — бесплатная коллекция плоских иконок.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-0e56ea3.png)
Smart House на Dribbble — бесплатный сет «Умный дом».
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-8d12c79.png)
Набор иконок для фитнес-проекта — бесплатный пак для коммерческого использования.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-a244de8.png)
Инструменты для подбора цвета
New Flat UI Color Picker — наглядный подбор цветов в стиле flat с кодами для копирования.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-8a51ca8.png)
Color Extraction Effect — инструмент для определения цветовой гаммы с картинки, нужно скачивать. Он сканирует картинку, определяет все ее цвета и из них выбирает небольшую палитру удачно сочетающихся друг с другом оттенков.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-185178b.png)
Flat UI Colors — подборка палитр цветов в стиле flat с кодами для копирования.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-16a5eda.png)
Coolors — генератор цветовых схем для дизайнеров, можно подбирать сочетающиеся оттенки и копировать коды цвета.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-1a39611.png)
Couleurs — простое приложение для определения цветов на экране, нужно скачать бесплатно.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-bd4ca3a.png)
Material UI Colors — целая палитра цветов для веба, Android и iOS в разных стилях.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-2d24d27.png)
Brand Colors — коллекция цветов, которыми пользуются знаменитые бренды.
![](/wp-content/uploads/2020/07/77-besplatnyh-instrumentov-dlja-graficheskogo-oformlenija-sajta-0805005.png)
Сервисы для подбора шрифтов
TypeGenius — поиск идеальных сочетаний шрифтов для каждого проекта.
1001 Free Fonts — огромная коллекция бесплатных шрифтов.
Google Fonts — бесплатные шрифты, оптимизированные специально под веб-сайты.
Font Squirrel — бесплатные коммерческие шрифты.
WhatTheFont — определяет шрифт по тексту на скриншоте, работает только с латиницей.
Расширения: для Google Chrome — Typ.io, Type Sample, для Opera — Font Finder или Font Inspector, для Chrome, Firefox и Яндекс.Браузера — WHATFONT.
Пишите в комментариях, подборки каких инструментов вам было бы интересно видеть в блоге!