Подбор цвета онлайн: 30 сервисов с красивыми цветовыми палитрами для любых дизайнов

Сервисы по подбору цвета онлайн.
Обновлено:

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

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

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

Для открытия скриншотов в полном размере и возможности их пролистывания, нажмите на кнопку из 9-ти квадратов в правом верхнем углу открытой галереи.

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

Muzli Colors - генератор цветовых палитр

Особенности сервиса:

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

Colors.lol - готовые палитры по принципу 60-30-10

Особенности сервиса:

  • простой в использовании сервис,
  • на сайте расположены готовые цветовые палитры,
  • есть фильтр по основным цветам, он располагается в верхней части страницы справа,
  • можно посмотреть названия цветов,
  • используется принцип 60-30-10,
  • возле каждой цветовой палитры справа есть иконка прямой ссылки на неё,
  • есть функция случайного выбора палитры (кнопка random в самом низу страницы).

Farbvelo.elastiq - случайные палитры

Особенности сервиса:

  • генератор случайных цветовых палитр,
  • по бокам палитры можно увидеть какой из её цветов получится градиент,
  • есть возможность настроек генерации цветовой палитры,
  • в разделе настроек есть функция подбора цвета из фотографий (случайных или загруженных с компьютера).

Brandcolors - 1600 цветов от 600 брендов

Особенности сервиса:

  • самая большая коллекция официальных цветовых кодов бренда в мире,
  • собраны цветовые палитры около 600 известных брендов,
  • на сайте 1600 цветов,
  • список сайта продолжает расти,
  • можно копировать код любого отдельного цвета,
  • есть ссылки на официальные сайты брендов.

Geenes - генератор палитр с выбором метода

Особенности сервиса:

  • многофункциональный сервис,
  • экспорт палитр в Figma, Adobe, Sketch и др.,
  • экспорт в Figma через установку плагина сервиса,
  • можно посмотреть палитры в разных сочетаниях на устройствах (мобильные приложения и др.),
  • разные методы генерации палитры,
  • в поиске можно задать ключевое слово для подбора палитры (море, горы и т.п.),
  • в бесплатной версии большинство функций,
  • в платной версии скачивание версии вида дизайна (мобильное устройство и др.).

Colorion - выбор палитр по определенному цвету

Особенности сервиса:

  • 2914 страниц с палитрами по 30 палитр на странице,
  • большое разнообразие цветовых палитр,
  • хорошо подобраны сочетания цветов,
  • для одного цвета — варианты палитр,
  • для примера, для розового цвета #E7C2BB сервис выдал 71 страницу по 30 палитр на каждой,
  • благодаря большому разнообразию готовых палитр для одного цвета - один из самых удобных для подбора сервисов.

Mobile Palette Generator - палитры для мобильных приложений

Особенности сервиса:

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

2colors - комбинации из двух цветов

Особенности сервиса:

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

Khroma - цветовые пары из 50-ти цветов

Особенности сервиса:

  • индивидуальный подход к подбору цветовых комбинаций - на основе личных предпочтений,
  • в начале надо выбрать 50 цветов из списка,
  • на их основе генерируются цветовые пары,
  • комбинации, которые можно рассматривать как типографику, градиент, палитру или пользовательское изображение,
  • фильтр по типу, оттенку, названию (coffee, sun и т.д.), а также значениям hex и rgb,
  • возможность сохранять понравившиеся цветовые пары в избранное.

Coolors - генератор цветовых палитр и градиентов

Особенности сервиса:

  • разные инструменты для работы с цветом на одном сайте,
  • тысячи красивых оттенков для создания палитр,
  • можно скопировать прямую ссылку на любую палитру,
  • при открытии палитры показывается большое количество похожих (similar palettes),
  • фильтр поиска палитр с разнообразными категориями: цвета, стили, темы,
  • сохранение цветов и палитр в избранное,
  • инструмент определения контраста между двумя цветами,
  • для работы с сервисом требуется регистрация,
  • плагин, который можно установить для редактора Figma,
  • есть платные функции (при оплате за месяц 376р.): удаление рекламы, до 10-ти цветов в палитре, 10+ млн готовых цветовых схем, безлимитное сохранение цветовых палитр и т.д.

In color balance - тысячи палитр из фотографий

Особенности сервиса:

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

Sorted-colors (Enes.in) - цвета с названиями

Особенности сервиса:

  • относительно простой сайт,
  • есть названия цветов,
  • при нажатии на цвет открывает краткая информация по нему,
  • выбор цвета осуществляется с помощью бегунка,
  • на осях палитры два параметра: saturation (насыщенность) и lightness (свет).

Cohesive Colors - палитры с помощью overlay

Особенности сервиса:

  • создание целостных цветовых палитр,
  • возможность случайного выбора с помощью кнопки "random",
  • работа в три шага: выбор цвета, добавление overlay (наложения), получение результата (палитры),
  • создание оригинальной цветовой палитры,
  • при добавлении наложения можно настраивать цвет и интенсивность (непрозрачность),
  • получившийся цвет можно скопировать, нажав на него,
  • возможность копирования прямой ссылки, с помощью которой можно поделиться получившейся палитрой.

Сolourco - подбор палитры с помощью мышки

Особенности сервиса:

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

Paletton - работа с основными схемами

Особенности http://paletton.com/:

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

Adobe Color - цвета по 10-ти правилам гармонии  

Особенности сервиса:

  • цветовой круг для подбора гармоничных сочетаний,
  • 10 правил гармонии цветов на основе заданного основного цвета,
  • чтобы сохранить подобранные палитры для дальнейшего использования в продуктах Adobe (Photoshop, Illustrator и т. д.) надо создать личный кабинет.

Hexcolorpedia - подробная информация о цвете

Особенности сервиса:

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

Materialpalette - палитры в стиле Material Design

Особенности сервиса:

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

Colorhexa - подробные данные по любому цвету

Особенности сервиса:

  • много данных по любому цвету,
  • разложение цвета на оттенки от самого темного до самого светлого,
  • разные системы кодировок цвета,
  • готовые цветовые схемы,
  • альтернативные цвета,
  • генератор градиентов,

Picular - цвета по ассоциациям со словами

Особенности сервиса:

  • для подбора цвета надо ввести в строку поиска на первой странице сайта ключевое слово на английском языке (winter , summer, banana и т.п.),
  • на получившихся цветах есть коды, которые копируются при нажатии на них,
  • чтобы собрать палитру, надо нажать на иконку кнопки и тогда цвет появится в верхнем ряду,
  • также есть возможность скопировать ссылку (например, https://picular.co/p/UZOj) на получившуюся палитру (до 4-х цветов) и поделиться ею в социальных сетях,
  • чтобы посмотреть на основе чего выбран цвет, в связи с какой ассоциацией, надо нажать на иконку изображения в правом нижнем углу области с цветом,
  • можно вводить более сложные ключевые слова, например, названия блюд, фильмов и так далее, и сервис предложит цвета-ассоциации.

Klart colors - просмотр палитры в готовом дизайне

Особенности сервиса:

  • коллекция цветовых палитр,
  • основатель сервиса год курировал дизайны в Pixels,
  • при нажатии на палитру она разворачивается на весь экран,
  • если кликнуть на цвет, он копируется в буфер обмена,
  • при нажатии "See in action"(увидеть в действии) сервис показывает как цвета из палитры выглядят в готовом проекте.

Shade Generator - простой генератор цвета и оттенков

Особенности сервиса:

  • есть возможность случайного выбора с помощью кнопки "random",
  • в поисковой строке сервиса можно вставить код любого цвета (Hex, RGB) или название цвета на английском языке (red, yellow и т.п.),
  • есть формат двойного экрана, включается с помощью кнопки "split view" - разделенный вид.

Random Color - генератор случайного цвета

Особенности сервиса:

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

Getcolor - широкий спектр инструментов

Особенности сервиса:

  • русскоязычный сайт,
  • определение сочетания цветов по методу Иттена,
  • подбор гаммы из 2/3/4 цветов,
  • коллекция готовых палитр,
  • основные цвета и их оттенки,
  • градация цветов,
  • смешивание цветов,
  • таблица смешивания цветов (примеры),
  • пипетка онлайн,
  • каталог цветов RAL CLASSIC  с названиями,
  • градиенты можно скачать в формате JPG,
  • простой фоторедактор.

Maketintsandshades - создание оттенков для заданного цвета

Особенности сервиса:

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

Happyhues - готовые цветовые палитры

Особенности сервиса:

  • сайт, на котором можно посмотреть цветовые палитры, реализованные на примере сайта и элементов на нем,
  • в палитрах использованы трендовые цвета,
  • можно скопировать коды цветов.

Colordot - выбор цвета перемещением курсора

Особенности сервиса:

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

Goodpalette - примерка готовых палитр на шаблонах сайтов

Особенности сервиса:

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

Colorlet - подборка готовых цветовых палитр

Особенности сервиса:

  • много цветовых палитр,
  • простой экспорт,
  • коды цвета по разным системам,
  • готовые градиенты,
  • редактор палитр,
  • генератор оттенков,
  • простой, понятный интерфейс.

Colorsinspo - многофункциональный сервис подбора цвета

Особенности сервиса:

  • тысячи цветовых палитр,
  • несколько инструментов для подбора цвета,
  • игра для тренировки подбора оттенков,
  • раздел с цветами брендов с возможностью скачивания палитр и получения прямых ссылок на определенную палитру,
  • есть плагины для XD Adobe, а также для редактора Figma.

Основные выводы

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

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

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

А на этом сегодня всё. Желаю вам успехов!

Нет комментариев

Оставить комментарий

Отправить комментарий Отменить

Сообщение