CSS фильтры




Добавляем в наш Каталог удобный и полезный онлайн-сервис, генерирующий CSS фильтры для изображений.

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

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

Например, это может выглядеть так:

Исходная картинка

CSS фильтры изображений

Изменяем оттенок поворота, насыщенность цвета, добавляем падающую тень:

.example {
-webkit-filter: hue-rotate(230deg) saturate(1.8) drop-shadow(1px 1px 10px grey);
}

Картинка меняется:

CSS фильтры

Вы можете выбрать и другие css фильтры ( размытие, оттенок серого, сепия, яркость, контраст, непрозрачность…)

перейти на сервис


Ещё онлайн сервисы: