¿Quizás has oído hablar de los filtros CSS? Puede aplicarlos a cualquier elemento de CSS, como:
.apply-css-filter ( -webkit-filter: grayscale(0.5); filter: grayscale(0.5); )Incluso puede aplicar eso a un elemento HTML o un elemento SVG.
Pero también hay filtros que puede definir dentro de SVG, y hay más opciones cuando lo hace. Aquí hay una definición de ejemplo:
Luego puede aplicarlo a un elemento directamente en el SVG como:
O, desde el CSS haciendo referencia a la ID de manera similar:
.apply-svg-filter ( -webkit-filter: url(#pictureFilter); filter: url(#pictureFilter); )Hay muchos filtros SVG. Los familiares como el desenfoque y los extraños que aplican efectos pictóricos. Aquí está la especificación.