Сегодня мы бы хотели поделиться с вами интересным скриптом, который подбирает цветовую палитру в зависимости от фотографии. Мы используем Vibrant.js от Jari Zwarts для извлечения основных цветов, и CSS фильтры для преобразования изображения. Так же в рамках примера используется слайдер с специальным эффектом. Заметка: в примере используются некоторые CSS свойства, которые поддерживаются не всеми версиями браузерами (CSS анимация, CSS фильтры). Как известно, IE 10+ не поддерживает CSS фильтры (если не говорить о Edge). Именно поэтому мы добавили специальный фолбэк с использованием SVG фильтров.

Фоновое изображение тоже будет преобразовано, а в специальных областях отобразятся hex-значения цвета.