SVG フィルタ

SVG フィルタ

SVG フィルタは、SVG グラフィックに特別な効果を追加するために使用されます。

SVG フィルタのブラウザサポート

表の数字は、SVGフィルタをサポートする最初のブラウザバージョンを指定しています。

SVG フィルターエレメント

次の章では、いくつかの可能性のあるフィルタ効果を示し、SVGが何ができるかを理解してもらいます。

SVGで利用できるフィルターエレメントは以下の通りです：

• <feBlend> - イメージを組み合わせるためのフィルタ
• <feColorMatrix> - カラートランスフォームフィルタ
• <feComponentTransfer>
• <feComposite>
• <feConvolveMatrix>
• <feDiffuseLighting>
• <feDisplacementMap>
• <feFlood>
• <feGaussianBlur>
• <feImage>
• <feMerge>
• <feMorphology>
• <feOffset> - フィルターシャドウ
• <feSpecularLighting>
• <feTile>
• <feTurbulence>
• <feDistantLight> - 照明フィルタ
• <fePointLight> - 照明フィルタ
• <feSpotLight> - 照明フィルタ

ヒント：各SVG要素に複数のフィルタを使用できます！