Извлекаем гамму основных цветов из фото

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



Исходники демо-примера можно скачать здесь в архиве zip со всеми скриптами, стилями и шрифтами.