При разработке или редизайне сайта понадобятся элементы оформления. Копирование изображений, иконок или всего дизайна с другой площадки чревато проблемами: например, с авторским правом или с жалобами регистратору сайта.
Кто не хочет нанимать веб-дизайнера, справляется самостоятельно. У CMS есть готовые недорогие или даже бесплатные темы для сайта, а сделать логотип, скачать готовые иконки, найти бесплатные шрифты и закрыть другие задачи вы можете с помощью этой подборки.
Бесплатное создание логотипа без водяного знака
В каждом сервисе мы создали по логотипу выдуманной компании, чтобы показать вам скриншоты интерфейса.
В некоторых можно создать и скачать готовый лого бесплатно, другие требуют разовую оплату за скачивание файла в большом размере. Эта оплата все равно сильно меньше, чем стоят услуги дизайнера.
- Logoza — русскоязычный сервис для создания лого с помощью большого выбора клипартов в цвете и графике. Регистрации не требует.
Скачать можно бесплатно, полный набор в хорошем качестве с прозрачностью, фавиконом для сайта, PDF-документом, мокапом и файлом шрифта стоит 250 рублей.
![Процесс создания логотипа](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/9994f82f19f00c9d5e2447bf1e83b596.jpg)
- Turbologo — русскоязычный генератор логотипов, сам предлагает готовые варианты после настройки.
Покупка большого файла обойдется в 790 рублей, маленький можно скачать просто так.
![как недизайнеру сделать логотип](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/4c754252a1275ecddca342a9188249e4.jpg)
- Renderforest — похожий конструктор. Предлагает немного вариантов, но довольно красивых, их можно доработать под себя.
Небольшой файл для некоммерческого использования можно получить бесплатно. Если нужен большой файл с коммерческой лицензией, придется купить один из тарифов от 499 рублей.
![разработка логотипа самостоятельно](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/b723b6b447b67b77bfb63e2a110ff72e.jpg)
- Logo maker от Wix — конструктор от платформы для создания сайтов Wix, позволяет настроить рекомендации по тематике и предпочтениям, выбрать готовый лого и отредактировать его.
Пакет файлов в высоком разрешении с правами на использование стоит 1500 рублей. Есть спецтарифы для тех, кто собирается делать сайт на Wix.
![разработка фирменного стиля своими руками](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/8730e32b7aac1e1815b0efd120b45c5c.jpg)
- Canva — простой редактор для логотипов, листовок, баннеров для соцсетей, сторис, обложек и изображений. Часть графических элементов открыта, все возможности доступны на тарифах от 500 рублей в месяц.
![бесплатный сервис для создания логотипа](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/9a8a80f0be3114ca9ec267167049c208.jpg)
- Logoshi — здесь с вариантами помогает система. Вы вводите название и слоган по желанию, выбираете цветовую гамму и смотрите готовые. Лучше справляется с латиницей.
Итог обойдется в $5 или $20 в зависимости от нужных форматов.
![редактор логотипов онлайн](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/bf5c6e933c70bcbb4aa5c14738596f68.jpg)
Logogarden — конструктор логотипов с помощью комбинирования готовых клипартов и текста.
В маленьком размере картинку можно скачать бесплатно, а пакет с большими размерами и правами стоит $12.
![онлайн инструмент для дизайнеров](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/778e6da4c944ca2b46a3f454cb5bf1bf.jpg)
GraphicSprings — из разных тематических клипартов и элементов можно собирать простые цветные лого.
За готовый файл в высоком разрешении со всеми правами на использование нужно отдать $19.99.
![онлайн конструктор лого](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/cee7e3f57acdad95ed5cd1b7df2bcf53.jpg)
- Logomaster — русскоязычный сервис для полуавтоматического конструирования логотипов.
Скачивание требует единоразовый платеж.
Базовый тариф — 1500 рублей, в него включен файл с разрешением 1024px на белом или прозрачном фоне. Более дорогие тарифы дают скачать файл в большом разрешении для печати, дорабатывать лого после оплаты и сохранять в векторе.
![сделать брендбук самостоятельно](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/052b5e007b0f420af20aecacd8c8b97e.jpg)
- Logomakr — сервис с возможностью составить логотип из клипартов и текста. Маленький файл для размещения на сайте можно скачать бесплатно, пакет больших с лицензией стоит $19.
![интерфейс конструктора](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/8c3965290ec063313cf2db31c14bf1e9.jpg)
- Onlinelogomaker — конструктор без готовых решений, позволяет делать логотип с нуля с помощью комбинирования и изменений клипартов и текста. С кириллицей работать не умеет.
Готовый логотип для коммерческого использования можно скачать за 29$, маленький для некоммерческого — бесплатно.
![редактор лого онлайн](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/2fd5c65565ac7f3ce99b26594c5c868e.jpg)
- Tailorbrands — сервис для автоматизированного создания логотипов с простыми пользовательскими настройками цвета и типа готового изображения.
Тарифы с подпиской на месяц начинаются от $9.99.
![создание фирстиля с помощью сервисов](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/e1d8e8879884dbef68f0cfe436687b0c.jpg)
Графические онлайн-редакторы, конструкторы инфографики и мемов
Сервисы подходят для кадрирования и редактирования готовых картинок, создания обложек для статей и красочной инфографики, объединения изображений в коллажи и создания мемов по шаблону.
Easel.ly — для работы с инфографикой;
Canva — для создания инфографики, флаеров, обложек и других картинок;
Online-fotoshop, Pixlr, Sumopaint — для работы с изображениями: позволяет кадрировать, вырезать фон, выполнять цветокоррекцию, объединять изображения и накладывать фильтры;
Online-image-editor — стандартный редактор, работает также с форматом gif;
PixBuilder Studio — редактор растровой графики, позволяющий создавать и web-графику;
Editor.pho, Fotor — фоторедактор с бьюти-инструментами для обработки кожи и добавления макияжа на фото;
Meme Generator, Iloveimg, Risovach, Mr-mem, 1001mem — генератор мемов онлайн.
Еще полезное по теме:
Большое руководство по SEO для картинок: как оптимизировать изображения на сайте
Подборка CSS- элементов для дизайна сайта
Сервисы, где представлены интересные решения для оформления интерактивных элементов на сайте, можно скопировать в HTML, CSS, JavaScript.
- Подборка CSS для вкладок — стили для оформления меню и других вкладок на сайте, у элементов есть код для копирования и внедрения на сайт.
![код CSS для меню](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/e961f5d98a1c95158b2978e5932ec09f.jpg)
- Подборка CSS для слайд-шоу — стили для оформления просмотра изображений в слайд-шоу, можно скопировать и вставить на сайт. Есть HTML, CSS и JavaScript.
![CSS, JavaScript, HTML для оформления слайд-шоу](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/9d64fbc4ea2589a1aaae23b4bd4a5012.jpg)
На сайте designyourway.net есть еще подборки с красивыми решениями оформления сайта.
- CodyHouse Framework — библиотека интерфейсных компонентов HTML, CSS, JavaScript, позволяют настроить фон, кнопки, навигацию и другие функции. Все адаптированы под мобильные.
![готовые меню для сайта](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/3e17211df17153d5df3f54814dc83c3d.jpg)
- Freebbble — бесплатные элементы дизайна из Dribbble: иконки, мокапы, паттерны, кнопки, шрифты. У многих указана лицензия для бесплатного коммерческого использования.
![паттерны для сайта бесплатно](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/114b3a7a477091bf118b2e5608cf2b9d.jpg)
- Dribbble — тоже подборки бесплатных элементов для дизайна: иконок, меню, персонажей, мокапов и других.
![интерфейсные готовые решения](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/e0c0efb189ce1de3ecfb61f6cad8c5de.jpg)
- Free Section of Creative Market — площадка с бесплатными работами, которыми делятся дизайнеры. Пополнение набора каждый понедельник.
![идеи для создания сайта](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/99d4f27669cfadfac56e33f1c69fc5ac.jpg)
Сервисы с бесплатными иконками
Иконки от дизайнеров. Можно скачать и использовать в меню, навигации, для выделения пунктов списка, кнопок. Некоторые иконки требуют указания авторства при размещении на сайте, советуем обращать внимание на лицензию перед скачиванием.
Фотостоки и фотобанки для скачивания бесплатных изображений
На многих сайтах указана лицензия для коммерческого использования, но советуем перепроверять перед скачиванием.
- Stock Up — картинки с разных сайтов в одном месте.
![коллекции фото на сайт](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/32bc730fddd3105d1154393b412c2895.jpg)
Pexels — русскоязычный сайт, разные тематики.
![подборки визуального контента](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/8fd16e44b6fa4352bd08b6bfb4e58eff.jpg)
Mazwai — не только фото, но и видеоклипы, и футажи.
![бесплатные видеоклипы для сайта](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/82eeaaaa209f2b0b0211d9fd3a4a94fd.jpg)
Foodie's Feed — продукты, готовые блюда и процесс приготовления.
![стоки с фото еды](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/d1a186e7e8bc962aa766e8931606fd81.jpg)
All The Free Stock — изображения, иллюстрации, иконки и видео.
![дизайнерские элементы для веба](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/7b26fd041366f1cdff07a048e56b4c62.jpg)
Jéshoots — тематические категории.
![фотобанки с лицензией](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/c7f1c08f3299b1e29148f9b13e4de965.jpg)
Pixabay — фотографии, иллюстрации и векторная графика.
![фоны для веб-дизайна](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/5f6c0305b886748657b532ae1cc23cca.jpg)
Unsplash — работы фотографов, можно скачивать в большом размере.
![фотоработы бесплатно](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/09494f1a0ecc826979f10eca455d368b.jpg)
- Picjumbo — скачивание в большом размере.
![сайты с фотографиями для дизайна](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/1fad759b8c53c7b97440a2cfa95c1e55.jpg)
Как еще можно найти изображения для сайта, в том числе фотографии людей, к которым не применяется авторское право — решения в статье
Инструменты для подбора цвета
Помогут найти нужную палитру сочетающихся цветов для оформления сайта.
- New Flat UI Color Picker — подбор цветов в стиле flat с кодами для копирования.
![цветовая веб-палитра онлайн](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/2587202f1b38a38b604f7c0595a54709.jpg)
- Flat UI Colors — сайт с похожей системой, позволяет подбирать палитры цветов по насыщенности и яркости.
![цветовая палитра сочетаний](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/f71387d30da025619a1a3c08cb1ceebf.jpg)
- Color Extraction Effect — инструмент для определения цветовой гаммы с картинки. Он сканирует изображение, определяет все ее цвета и из них выбирает небольшую палитру удачно сочетающихся друг с другом оттенков. Требует скачивания.
![подобрать цвета по веб-странице](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/b1e841e6424f844c93ee13eafd22baf1.jpg)
- Coolors — генератор цветовых схем для дизайнеров, можно подбирать сочетающиеся оттенки и копировать коды цвета.
![цветовые схемы для дизайна](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/19190cc766ff8af7c9c16b087d1d82df.jpg)
- Couleurs — простое приложение для определения цветов на экране. Требует скачивания, бесплатно.
![определение цветов](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/6a33e8d13f650c6f343cb58485798e16.jpg)
- Material UI Colors — палитра для веба, Android и iOS в разных стилях.
![коды цветов для веба](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/2ebff8c42130b083c886043116eb5e5e.jpg)
Brand Colors — коллекция цветов, которыми пользуются знаменитые бренды.
![цвета известных брендов](https://s3-eu-central-1.amazonaws.com/news.pr-cy.ru/535312/images/40b112c80473350365fd3b65a19ae4a5.jpg)
Сервисы для подбора шрифтов на сайт
На этих площадках можно найти интересные шрифты для веба. Большинство из них с лицензией на бесплатное коммерческое использование:
Google Fonts, Fonts-online, Freebbble, 1001 Free Fonts, Fontlibrary, Font Squirrel, 1001fonts.com, 42+ кириллических шрифта, Typetype, Facefont.
Если вам понравился шрифт на чужом сайте, с помощью этих инструментов можно попробовать узнать его название.
WhatTheFont — определяет шрифт по тексту на скриншоте, работает только с латиницей;
Typ.io, Type Sample — расширение для Google Chrome;
Font Finder, Font Inspector — для Opera;
WHATFONT — для Chrome, Firefox и Яндекс.Браузера.
Пишите в комментариях, подборки каких инструментов вам было бы интересно видеть в блоге!