Filtros de SVG

Filtros de SVG

Los filtros SVG se utilizan para agregar efectos especiales a los gráficos SVG.

Compatibilidad del navegador con los filtros SVG

Los números en la tabla especifican la versión del primer navegador que admite los filtros SVG.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
8.0 10.0 3.0 6.0 9.6

Elementos de filtro SVG

En los siguientes capítulos, mostraremos algunos efectos de filtro posibles y le explicaremos lo que puede hacer SVG.

Los elementos de filtrado disponibles en SVG son:

  • <feBlend> - Filtro utilizado para combinar imágenes
  • <feColorMatrix> - Filtro de transformación de color
  • <feComponentTransfer>
  • <feComposite>
  • <feConvolveMatrix>
  • <feDiffuseLighting>
  • <feDisplacementMap>
  • <feFlood>
  • <feGaussianBlur>
  • <feImage>
  • <feMerge>
  • <feMorphology>
  • <feOffset> - Filtrado de sombra
  • <feSpecularLighting>
  • <feTile>
  • <feTurbulence>
  • <feDistantLight> - Filtro de iluminación
  • <fePointLight> - Filtro de iluminación
  • <feSpotLight> - Filtro de iluminación

Consejo: ¡Puedes usar varios filtros en cada elemento SVG!