Може би сте чували за CSS филтри? Можете да ги приложите да правят всеки елемент от CSS, като:
.apply-css-filter ( -webkit-filter: grayscale(0.5); filter: grayscale(0.5); )
Можете дори да приложите това към HTML елемент или SVG елемент.
Но има и филтри, които можете да дефинирате в SVG, и има повече опции, когато го направите. Ето примерна дефиниция:
След това можете да го приложите към елемент точно в SVG като:
Или от CSS, като препращате идентификатора по подобен начин:
.apply-svg-filter ( -webkit-filter: url(#pictureFilter); filter: url(#pictureFilter); )
Има много SVG филтри. Познати като размазване и странни, които прилагат живописни ефекти. Ето спецификациите.