Извлечь палитру из фотографии — самый быстрый и самый честный способ прийти к цветовой схеме. Цвета хорошей фотографии уже работают вместе, потому что были освещены одним светом и сняты одним сенсором. Дизайнеры строят схемы так с тех пор, как появились фотографии, из которых их можно брать.
Инструмент извлекает до шести цветов из любого изображения. Он уменьшает изображение до маленького образца, относит каждый пиксель к приблизительной цветовой корзине, сортирует корзины по числу попавших в них пикселей, а затем идёт по этому рейтингу, выбирая цвета, достаточно далёкие от уже отобранных. Именно последний шаг не даёт фотографии пляжа вернуть шесть оттенков одного бежевого.
Анализ выполняется в браузере над уменьшенной копией вашего изображения. Ничего не загружается, и никакая палитра нигде не сохраняется.
| Шаг | Что происходит |
|---|---|
| Уменьшение | Изображение приводится к 80 пикселям по длинной стороне |
| Группировка | Каждый пиксель относится к приблизительной цветовой корзине |
| Сортировка | Корзины сортируются по числу пикселей |
| Разделение | Кандидат пропускается, если слишком близок к уже выбранному цвету |
| Усреднение | Каждая выбранная корзина возвращает реальное среднее своих пикселей |
Предварительное уменьшение сделано намеренно. Оно усредняет шум сенсора и артефакты JPEG, которые иначе породили бы тысячи почти одинаковых цветов, затопив рейтинг бессмысленными вариациями.
Извлечённая палитра — сырьё, а не готовая система. Цвет, занимающий большую часть изображения, обычно ваш фон; самый маленький и насыщенный обычно акцент, и он должен остаться акцентом, а не стать фоном.
Всегда проверяйте контраст перед решением. Два цвета, отлично смотрящиеся рядом на фотографии, могут быть очень далеки от соотношения 4,5:1, которого обычный текст требует относительно своего фона. Извлечённые палитры особенно этому подвержены, поскольку фотографии полны полутонов, слишком близких друг к другу для текста.
До шести. Меньше возвращается, когда в изображении действительно нет шести достаточно различных цветов: монохромная фотография может дать три.
Каждый образец является средним по группе похожих пикселей, а не отдельным взятым пикселем. Это даёт более представительный цвет, чем произвольная точка, которая могла бы попасть на блик или на артефакт сжатия.
Нет. Отбор автоматический, на основе доли изображения, занимаемой каждым цветом, и того, насколько он отличается от уже выбранных. Обрежьте интересующую область заранее, если хотите повлиять на результат.
Кликните по образцу, чтобы скопировать код в буфер обмена, и вставьте его в свой CSS, в дизайн-инструмент или в бренд-документ. Загрузка даёт все шесть подписанным изображением.
Не обязательно. Инструмент отбирает визуально различные цвета, а не цвета, удовлетворяющие требованиям контраста. Всегда проверяйте пары «текст — фон» контраст-чекером перед публикацией.
Нет. Анализ выполняется над уменьшенной копией в браузере, ничего не передаётся.
