Eng

URL
(px)







(deg)









(px) (px) (px)






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

С появлением поддержки SVG современными браузерами, появилось и новое свойство CSS - "filter", как часть той же спецификации. Сам синтаксис CSS значительно упрощает описание, по сравнению с описанием фильтров SVG. Фильтры дают отличные возможности для дизайнерских решений в web-разработке, к тому же их можно комбинировать и получать необходимый результат прямо в браузере, а не в графическом редакторе. Но не стоит обольщаться и злоупотреблять данным свойством, CSS фильтры могут значительно влиять на производительность вашего проекта. К самым ресурсо затратным относятся те фильтры, в которых есть размытие - это blur() и drop-shadow(). Это связанно с вычислением на пиксельной сетке, где происходит смешивание цветов в установленном радиусе. Чем больше установлен радиус, тем больше времени занимают вычисления. В наш генератор мы не стали добавлять url(), который позволяет вставлять ссылку на SVG фильтр, но такая возможность у свойства "filter" есть.