Извлеките цветовую палитру из изображения

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

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

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

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

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