Widely availableSupported across all major browsers. Safe to use in production.
SVG Widely available

SVG filters

The <filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.

SVG

Overview

The <filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
color-interpolation-filters
1
79
3
3
18
2
DOM API
SVGFEBlendElement

The SVGFEBlendElement interface corresponds to the feBlend element.
5
12
3
6
18
6
height

The height read-only property of the SVGFEBlendElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
in1

The in1 read-only property of the SVGFEBlendElement interface reflects the in attribute of the given element.
5
12
3
6
18
6
in2

The in2 read-only property of the SVGFEBlendElement interface reflects the in2 attribute of the given element.
5
12
3
6
18
6
mode

The mode read-only property of the SVGFEBlendElement interface reflects the mode attribute of the given element. It takes one of the SVGFEBLENDMODE_* constants defined on this interface.
5
12
3
6
18
6
result

The result read-only property of the SVGFEBlendElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
3
6
18
6
width

The width read-only property of the SVGFEBlendElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFEBlendElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFEBlendElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
SVGFEColorMatrixElement

The SVGFEColorMatrixElement interface corresponds to the feColorMatrix element.
5
12
3
6
18
6
height

The height read-only property of the SVGFEColorMatrixElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
in1

The in1 read-only property of the SVGFEColorMatrixElement interface reflects the in attribute of the given element.
5
12
3
6
18
6
result

The result read-only property of the SVGFEColorMatrixElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
3
6
18
6
type

The type read-only property of the SVGFEColorMatrixElement interface reflects the type attribute of the given element. It takes one of the SVGFECOLORMATRIXTYPE_* constants defined on this interface.
5
12
3
6
18
6
values

The values read-only property of the SVGFEColorMatrixElement interface reflects the values attribute of the given element.
5
12
3
6
18
6
width

The width read-only property of the SVGFEColorMatrixElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFEColorMatrixElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFEColorMatrixElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
SVGFEComponentTransferElement

The SVGFEComponentTransferElement interface corresponds to the feComponentTransfer element.
5
12
3
6
18
6
height

The height read-only property of the SVGFEComponentTransferElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
29
6
18
6
in1

The in1 read-only property of the SVGFEComponentTransferElement interface reflects the in attribute of the given feComponentTransfer element.
5
12
3
6
18
6
result

The result read-only property of the SVGFEComponentTransferElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
29
6
18
6
width

The width read-only property of the SVGFEComponentTransferElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
29
6
18
6
x

The x read-only property of the SVGFEComponentTransferElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
29
6
18
6
y

The y read-only property of the SVGFEComponentTransferElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
29
6
18
6
SVGFECompositeElement

The SVGFECompositeElement interface corresponds to the feComposite element.
5
12
3
6
18
6
height

The height read-only property of the SVGFECompositeElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
in1

The in1 read-only property of the SVGFECompositeElement interface reflects the in attribute of the given feComposite element.
5
12
3
6
18
6
in2

The in2 read-only property of the SVGFECompositeElement interface reflects the in2 attribute of the given feComposite element.
5
12
3
6
18
6
k1

The k1 read-only property of the SVGFECompositeElement interface reflects the k1 attribute of the given feComposite element.
5
12
3
6
18
6
k2

The k2 read-only property of the SVGFECompositeElement interface reflects the k2 attribute of the given feComposite element.
5
12
3
6
18
6
k3

The k3 read-only property of the SVGFECompositeElement interface reflects the k3 attribute of the given feComposite element.
5
12
3
6
18
6
k4

The k4 read-only property of the SVGFECompositeElement interface reflects the k4 attribute of the given feComposite element.
5
12
3
6
18
6
operator

The operator read-only property of the SVGFECompositeElement interface reflects the operator attribute of the given feComposite element.
5
12
3
6
18
6
result

The result read-only property of the SVGFECompositeElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
3
6
18
6
width

The width read-only property of the SVGFECompositeElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFECompositeElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFECompositeElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
SVGFEConvolveMatrixElement

The SVGFEConvolveMatrixElement interface corresponds to the feConvolveMatrix element.
6
12
3
6
18
6
bias

The bias read-only property of the SVGFEConvolveMatrixElement interface reflects the bias attribute of the given feConvolveMatrix element.
6
12
3
6
18
6
divisor

The divisor read-only property of the SVGFEConvolveMatrixElement interface reflects the divisor attribute of the given feConvolveMatrix element.
6
12
3
6
18
6
edgeMode

The edgeMode read-only property of the SVGFEConvolveMatrixElement interface reflects the edgeMode attribute of the given feConvolveMatrix element. The SVGEDGEMODE* constants defined on this interface are represented by the numbers 1 through 3, where the default duplicate is 1, wrap is 2, and none is 3.
6
12
3
6
18
6
height

The height read-only property of the SVGFEConvolveMatrixElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
6
12
3
6
18
6
in1

The in1 read-only property of the SVGFEConvolveMatrixElement interface reflects the in attribute of the given feConvolveMatrix element.
6
12
3
6
18
6
kernelMatrix

The kernelMatrix read-only property of the SVGFEConvolveMatrixElement interface reflects the kernelMatrix attribute of the given feConvolveMatrix element.
6
12
3
6
18
6
kernelUnitLengthX

The kernelUnitLengthX read-only property of the SVGFEConvolveMatrixElement interface reflects the kernelUnitLength attribute of the given feConvolveMatrix element.
6
12
3
6
18
6
kernelUnitLengthY

The kernelUnitLengthY read-only property of the SVGFEConvolveMatrixElement interface reflects the kernelUnitLength attribute of the given feConvolveMatrix element.
6
12
3
6
18
6
orderX

The orderX read-only property of the SVGFEConvolveMatrixElement interface reflects the order attribute of the given feConvolveMatrix element.
6
12
3
6
18
6
orderY

The orderY read-only property of the SVGFEConvolveMatrixElement interface reflects the order attribute of the given feConvolveMatrix element.
6
12
3
6
18
6
preserveAlpha

The preserveAlpha read-only property of the SVGFEConvolveMatrixElement interface reflects the preserveAlpha attribute of the given feConvolveMatrix element.
6
12
3
6
18
6
result

The result read-only property of the SVGFEConvolveMatrixElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
6
12
3
6
18
6
targetX

The targetX read-only property of the SVGFEConvolveMatrixElement interface reflects the targetX attribute of the given feConvolveMatrix element.
6
12
3
6
18
6
targetY

The targetY read-only property of the SVGFEConvolveMatrixElement interface reflects the targetY attribute of the given feConvolveMatrix element.
6
12
3
6
18
6
width

The width read-only property of the SVGFEConvolveMatrixElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
6
12
3
6
18
6
x

The x read-only property of the SVGFEConvolveMatrixElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
6
12
3
6
18
6
y

The y read-only property of the SVGFEConvolveMatrixElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
6
12
3
6
18
6
SVGFEDiffuseLightingElement

The SVGFEDiffuseLightingElement interface corresponds to the feDiffuseLighting element.
5
12
3
6
18
6
diffuseConstant

The diffuseConstant read-only property of the SVGFEDiffuseLightingElement interface reflects the diffuseConstant attribute of the given feDiffuseLighting element.
5
12
3
6
18
6
height

The height read-only property of the SVGFEDiffuseLightingElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
in1

The in1 read-only property of the SVGFEDiffuseLightingElement interface reflects the in attribute of the given feDiffuseLighting element.
5
12
3
6
18
6
kernelUnitLengthX

The kernelUnitLengthX read-only property of the SVGFEDiffuseLightingElement interface reflects the X component of the kernelUnitLength attribute of the given feDiffuseLighting element.
5
12
3
6
18
6
kernelUnitLengthY

The kernelUnitLengthY read-only property of the SVGFEDiffuseLightingElement interface reflects the Y component of the kernelUnitLength attribute of the given feDiffuseLighting element.
5
12
3
6
18
6
result

The result read-only property of the SVGFEDiffuseLightingElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
3
6
18
6
surfaceScale

The surfaceScale read-only property of the SVGFEDiffuseLightingElement interface reflects the surfaceScale attribute of the given feDiffuseLighting element.
5
12
3
6
18
6
width

The width read-only property of the SVGFEDiffuseLightingElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFEDiffuseLightingElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFEDiffuseLightingElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
SVGFEDisplacementMapElement

The SVGFEDisplacementMapElement interface corresponds to the feDisplacementMap element.
5
12
3
6
18
6
height

The height read-only property of the SVGFEDisplacementMapElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
in1

The in1 read-only property of the SVGFEDisplacementMapElement interface reflects the in attribute of the given feDisplacementMap element.
5
12
3
6
18
6
in2

The in2 read-only property of the SVGFEDisplacementMapElement interface reflects the in2 attribute of the given feDisplacementMap element.
5
12
3
6
18
6
result

The result read-only property of the SVGFEDisplacementMapElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
3
6
18
6
scale

The scale read-only property of the SVGFEDisplacementMapElement interface reflects the scale attribute of the given feDisplacementMap element.
5
12
3
6
18
6
width

The width read-only property of the SVGFEDisplacementMapElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFEDisplacementMapElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
xChannelSelector

The xChannelSelector read-only property of the SVGFEDisplacementMapElement interface reflects the xChannelSelector attribute of the given feDisplacementMap element. It takes one of the SVGCHANNEL* constants defined on this interface.
5
12
3
6
18
6
y

The y read-only property of the SVGFEDisplacementMapElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
yChannelSelector

The yChannelSelector read-only property of the SVGFEDisplacementMapElement interface reflects the yChannelSelector attribute of the given feDisplacementMap element. It takes one of the SVGCHANNEL* constants defined on this interface.
5
12
3
6
18
6
SVGFEDistantLightElement

The SVGFEDistantLightElement interface corresponds to the feDistantLight element.
5
12
3
6
18
6
azimuth

The azimuth read-only property of the SVGFEDistantLightElement interface reflects the azimuth attribute of the given feDistantLight element.
5
12
3
6
18
6
elevation

The elevation read-only property of the SVGFEDistantLightElement interface reflects the elevation attribute of the given feDistantLight element.
5
12
3
6
18
6
SVGFEDropShadowElement

The SVGFEDropShadowElement interface corresponds to the feDropShadow element.
13
79
30
6
18
6
dx

The dx read-only property of the SVGFEDropShadowElement interface reflects the dx attribute of the given feDropShadow element.
13
79
30
6
18
6
dy

The dy read-only property of the SVGFEDropShadowElement interface reflects the dy attribute of the given feDropShadow element.
13
79
30
6
18
6
height

The height read-only property of the SVGFEDropShadowElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
13
79
30
6
18
6
in1

The in1 read-only property of the SVGFEDropShadowElement interface reflects the in attribute of the given feDropShadow element.
13
79
30
6
18
6
result

The result read-only property of the SVGFEDropShadowElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
13
79
30
6
18
6
setStdDeviation

The setStdDeviation() method of the SVGFEDropShadowElement interface sets the values for the stdDeviation attribute.
13
79
30
6
18
6
stdDeviationX

The stdDeviationX read-only property of the SVGFEDropShadowElement interface reflects the (possibly automatically computed) X component of the stdDeviation attribute of the given feDropShadow element.
13
79
30
6
18
6
stdDeviationY

The stdDeviationY read-only property of the SVGFEDropShadowElement interface reflects the (possibly automatically computed) Y component of the stdDeviation attribute of the given feDropShadow element.
13
79
30
6
18
6
width

The width read-only property of the SVGFEDropShadowElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
13
79
30
6
18
6
x

The x read-only property of the SVGFEDropShadowElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
13
79
30
6
18
6
y

The y read-only property of the SVGFEDropShadowElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
13
79
30
6
18
6
SVGFEFloodElement

The SVGFEFloodElement interface corresponds to the feFlood element.
5
12
3
6
18
6
height

The height read-only property of the SVGFEFloodElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
35
6
18
6
result

The result read-only property of the SVGFEFloodElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
35
6
18
6
width

The width read-only property of the SVGFEFloodElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
35
6
18
6
x

The x read-only property of the SVGFEFloodElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
35
6
18
6
y

The y read-only property of the SVGFEFloodElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
35
6
18
6
SVGFEFuncAElement

The SVGFEFuncAElement interface corresponds to the feFuncA element.
5
12
3
6
18
6
SVGFEFuncBElement

The SVGFEFuncBElement interface corresponds to the feFuncB element.
5
12
3
6
18
6
SVGFEFuncGElement

The SVGFEFuncGElement interface corresponds to the feFuncG element.
5
12
3
6
18
6
SVGFEFuncRElement

The SVGFEFuncRElement interface corresponds to the feFuncR element.
5
12
3
6
18
6
SVGFEGaussianBlurElement

The SVGFEGaussianBlurElement interface corresponds to the feGaussianBlur element.
5
12
3
6
18
6
edgeMode

The edgeMode read-only property of the SVGFEGaussianBlurElement interface determines what color values to use when the blur needs to sample pixels beyond the edge of the input image. It reflects the edgeMode attribute of the given feGaussianBlur element.
8
8
height

The height read-only property of the SVGFEGaussianBlurElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
29
6
18
6
in1

The in1 read-only property of the SVGFEGaussianBlurElement interface reflects the in attribute of the given feGaussianBlur element.
5
12
3
6
18
6
result

The result read-only property of the SVGFEGaussianBlurElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
29
6
18
6
setStdDeviation

The setStdDeviation() method of the SVGFEGaussianBlurElement interface sets the values for the stdDeviation attribute.
5
12
3
6
18
6
stdDeviationX

The stdDeviationX read-only property of the SVGFEGaussianBlurElement interface reflects the (possibly automatically computed) X component of the stdDeviation attribute of the given feGaussianBlur element.
5
12
3
6
18
6
stdDeviationY

The stdDeviationY read-only property of the SVGFEGaussianBlurElement interface reflects the (possibly automatically computed) Y component of the stdDeviation attribute of the given feGaussianBlur element.
5
12
3
6
18
6
width

The width read-only property of the SVGFEGaussianBlurElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
29
6
18
6
x

The x read-only property of the SVGFEGaussianBlurElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
29
6
18
6
y

The y read-only property of the SVGFEGaussianBlurElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
29
6
18
6
SVGFEImageElement

The SVGFEImageElement interface corresponds to the feImage element.
5
12
3
6
18
6
crossOrigin
114
height

The height read-only property of the SVGFEImageElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
href

The href read-only property of the SVGFEImageElement interface reflects the href or xlink:href attribute of the given feImage element.
5
12
3
6
18
6
preserveAspectRatio

The preserveAspectRatio read-only property of the SVGFEImageElement interface reflects the preserveAspectRatio attribute of the given feImage element.
5
12
22
6
18
6
result

The result read-only property of the SVGFEImageElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
3
6
18
6
width

The width read-only property of the SVGFEImageElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFEImageElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFEImageElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
SVGFEMergeElement

The SVGFEMergeElement interface corresponds to the feMerge element.
5
12
3
6
18
6
height

The height read-only property of the SVGFEMergeElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
result

The result read-only property of the SVGFEMergeElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
3
6
18
6
width

The width read-only property of the SVGFEMergeElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFEMergeElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFEMergeElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
SVGFEMergeNodeElement

The SVGFEMergeNodeElement interface corresponds to the feMergeNode element.
5
12
3
6
18
6
in1

The in1 read-only property of the SVGFEMergeNodeElement interface reflects the in attribute of the given feMergeNode element.
5
12
3
6
18
6
SVGFEMorphologyElement

The SVGFEMorphologyElement interface corresponds to the feMorphology element.
5
12
3
6
18
6
height

The height read-only property of the SVGFEMorphologyElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
in1

The in1 read-only property of the SVGFEMorphologyElement interface reflects the in attribute of the given feMorphology element.
5
12
3
6
18
6
operator

The operator read-only property of the SVGFEMorphologyElement interface reflects the operator attribute of the given feMorphology element. It takes one of the SVGMORPHOLOGYOPERATOR_* constants defined on this interface.
5
12
3
6
18
6
radiusX

The radiusX read-only property of the SVGFEMorphologyElement interface reflects the X component of the radius attribute of the given feMorphology element.
5
12
3
6
18
6
radiusY

The radiusY read-only property of the SVGFEMorphologyElement interface reflects the Y component of the radius attribute of the given feMorphology element.
5
12
3
6
18
6
result

The result read-only property of the SVGFEMorphologyElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
3
6
18
6
width

The width read-only property of the SVGFEMorphologyElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFEMorphologyElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFEMorphologyElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
SVGFEOffsetElement

The SVGFEOffsetElement interface corresponds to the feOffset element.
5
12
3
6
18
6
dx

The dx read-only property of the SVGFEOffsetElement interface reflects the dx attribute of the given feOffset element.
5
12
3
6
18
6
dy

The dy read-only property of the SVGFEOffsetElement interface reflects the dy attribute of the given feOffset element.
5
12
3
6
18
6
height

The height read-only property of the SVGFEOffsetElement interface describes the vertical size of an SVG filter primitive as an SVGAnimatedLength.
5
12
3
6
18
6
in1

The in1 read-only property of the SVGFEOffsetElement interface reflects the in attribute of the given feOffset element.
5
12
3
6
18
6
result

The result read-only property of the SVGFEOffsetElement interface describes the assigned name of an SVG filter primitive as an SVGAnimatedString.
5
12
3
6
18
6
width

The width read-only property of the SVGFEOffsetElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFEOffsetElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFEOffsetElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
SVGFEPointLightElement

The SVGFEPointLightElement interface corresponds to the fePointLight element.
5
12
3
6
18
6
x

The x read-only property of the SVGFEPointLightElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedNumber.
5
12
3
6
18
6
y

The y read-only property of the SVGFEPointLightElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedNumber.
5
12
3
6
18
6
z

The z read-only property of the SVGFEPointLightElement interface describes the z-axis value of the position of an SVG filter primitive as a SVGAnimatedNumber. A positive Z-axis comes out towards the person viewing the content.
5
12
3
6
18
6
SVGFESpecularLightingElement

The SVGFESpecularLightingElement interface corresponds to the feSpecularLighting element.
5
12
3
6
18
6
height

The height read-only property of the SVGFESpecularLightingElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
in1

The in1 read-only property of the SVGFESpecularLightingElement interface reflects the in attribute of the given feSpecularLighting element.
5
12
3
6
18
6
kernelUnitLengthX

The kernelUnitLengthX read-only property of the SVGFESpecularLightingElement interface reflects the x value of the kernelUnitLength attribute of the given feSpecularLighting element.
45
12
3
17.4
45
17.4
kernelUnitLengthY

The kernelUnitLengthY read-only property of the SVGFESpecularLightingElement interface reflects the y value of the kernelUnitLength attribute of the given feSpecularLighting element.
45
12
3
17.4
45
17.4
result

The result read-only property of the SVGFESpecularLightingElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
3
6
18
6
specularConstant

The specularConstant read-only property of the SVGFESpecularLightingElement interface reflects the specularConstant attribute of the given feSpecularLighting element.
5
12
3
6
18
6
specularExponent

The specularExponent read-only property of the SVGFESpecularLightingElement interface reflects the specularExponent attribute of the given feSpecularLighting element.
5
12
3
6
18
6
surfaceScale

The surfaceScale read-only property of the SVGFESpecularLightingElement interface reflects the surfaceScale attribute of the given feSpecularLighting element.
5
12
3
6
18
6
width

The width read-only property of the SVGFESpecularLightingElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFESpecularLightingElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFESpecularLightingElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
SVGFESpotLightElement

The SVGFESpotLightElement interface corresponds to the feSpotLight element.
5
12
3
6
18
6
limitingConeAngle

The limitingConeAngle read-only property of the SVGFESpotLightElement interface reflects the limitingConeAngle attribute of the given feSpotLight element.
5
12
3
6
18
6
pointsAtX

The pointsAtX read-only property of the SVGFESpotLightElement interface reflects the pointsAtX attribute of the given feSpotLight element.
5
12
3
6
18
6
pointsAtY

The pointsAtY read-only property of the SVGFESpotLightElement interface reflects the pointsAtY attribute of the given feSpotLight element.
5
12
3
6
18
6
pointsAtZ

The pointsAtZ read-only property of the SVGFESpotLightElement interface reflects the pointsAtZ attribute of the given feSpotLight element.
5
12
3
6
18
6
specularExponent

The specularExponent read-only property of the SVGFESpotLightElement interface reflects the specularExponent attribute of the given feSpotLight element.
5
12
3
6
18
6
x

The x read-only property of the SVGFESpotLightElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedNumber.
5
12
3
6
18
6
y

The y read-only property of the SVGFESpotLightElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedNumber.
5
12
3
6
18
6
z

The z read-only property of the SVGFESpotLightElement interface describes the z-axis value of the position of an SVG filter primitive as a SVGAnimatedNumber. A positive Z-axis comes out towards the person viewing the content.
5
12
3
6
18
6
SVGFETileElement

The SVGFETileElement interface corresponds to the feTile element.
5
12
3
6
18
6
height

The height read-only property of the SVGFETileElement interface describes the vertical size of an SVG filter primitive as an SVGAnimatedLength.
5
12
3
6
18
6
in1

The in1 read-only property of the SVGFETileElement interface reflects the in attribute of the given feTile element.
5
12
3
6
18
6
result

The result read-only property of the SVGFETileElement interface describes the assigned name of an SVG filter primitive as an SVGAnimatedString.
5
12
3
6
18
6
width

The width read-only property of the SVGFETileElement interface describes the horizontal size of an SVG filter primitive as an SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFETileElement interface describes the horizontal coordinate of the position of an SVG filter primitive as an SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFETileElement interface describes the vertical coordinate of the position of an SVG filter primitive as an SVGAnimatedLength.
5
12
3
6
18
6
SVGFETurbulenceElement

The SVGFETurbulenceElement interface corresponds to the feTurbulence element.
5
12
3
6
18
6
baseFrequencyX

The baseFrequencyX read-only property of the SVGFETurbulenceElement interface reflects the X component of the baseFrequency attribute of the given feTurbulence element.
5
12
3
6
18
6
baseFrequencyY

The baseFrequencyY read-only property of the SVGFETurbulenceElement interface reflects the Y component of the baseFrequency attribute of the given feTurbulence element.
5
12
3
6
18
6
height

The height read-only property of the SVGFETurbulenceElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
numOctaves

The numOctaves read-only property of the SVGFETurbulenceElement interface reflects the numOctaves attribute of the given feTurbulence element.
5
12
3
6
18
6
result

The result read-only property of the SVGFETurbulenceElement interface describes the assigned name of an SVG filter primitive as a SVGAnimatedString.
5
12
3
6
18
6
seed

The seed read-only property of the SVGFETurbulenceElement interface reflects the seed attribute of the given feTurbulence element.
5
12
3
6
18
6
stitchTiles

The stitchTiles read-only property of the SVGFETurbulenceElement interface reflects the stitchTiles attribute of the given feTurbulence element. It takes one of the SVGSTITCHTYPE* constants defined on this interface.
5
12
3
6
18
6
type

The type read-only property of the SVGFETurbulenceElement interface reflects the type attribute of the given feTurbulence element. It takes one of the SVGTURBULENCETYPE_* constants defined on this interface.
5
12
3
6
18
6
width

The width read-only property of the SVGFETurbulenceElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFETurbulenceElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFETurbulenceElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
SVGFilterElement

The SVGFilterElement interface provides access to the properties of filter elements, as well as methods to manipulate them.
5
12
3
6
18
6
filterUnits

The filterUnits read-only property of the SVGFilterElement interface reflects the filterUnits attribute of the given filter element. It takes one of the SVGUNITTYPE_* constants defined in SVGUnitTypes.
5
12
3
6
18
6
height

The height read-only property of the SVGFilterElement interface describes the vertical size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
href

The href read-only property of the SVGFilterElement interface reflects the href or xlink:href attribute of the given filter element.
5
12
3
6
18
6
primitiveUnits

The primitiveUnits read-only property of the SVGFilterElement interface reflects the primitiveUnits attribute of the given filter element. It takes one of the SVGUNITTYPE_* constants defined in SVGUnitTypes.
5
12
3
6
18
6
width

The width read-only property of the SVGFilterElement interface describes the horizontal size of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
x

The x read-only property of the SVGFilterElement interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
y

The y read-only property of the SVGFilterElement interface describes the vertical coordinate of the position of an SVG filter primitive as a SVGAnimatedLength.
5
12
3
6
18
6
CSS property
auto
1
79
3
3
18
2
linearRGB
28
79
22
9
28
9
sRGB
28
79
22
9
28
9
svg elements

On SVG elements
89
89
35
89
Other
css.properties.flood-color

The flood-color CSS property defines the color of the current filter primitive subregion in feFlood and feDropShadow elements within a filter. If present, it overrides the element's flood-color attribute.
5
12
3
6
18
6
CSS property
currentColor
5
12
3
6
18
6
transparent
5
12
3
6
18
6
Other
css.properties.flood-opacity

The flood-opacity CSS property defines the opacity of the current filter primitive subregion in feFlood and feDropShadow elements within a filter. If present, it overrides the element's flood-opacity attribute.
5
12
3
6
18
6
css.properties.lighting-color

The lighting-color CSS property defines the color of the light source for the feDiffuseLighting and feSpecularLighting SVG lighting filter primitives within an SVG filter. If present, it overrides the element's lighting-color attribute.
5
12
3
6
18
6
CSS property
currentColor
5
12
3
6
18
6
transparent
5
12
3
6
18
6
Other
svg.elements.feBlend

The SVG filter primitive composes two objects together ruled by a certain blending mode. This is similar to what is known from image editing software when blending two layers. The mode is defined by the mode attribute.
5
12
4
6
18
6
svg.elements.feBlend.in
5
12
4
6
18
6
svg.elements.feBlend.in2
5
12
4
6
18
6
svg.elements.feBlend.mode

The mode attribute defines the blending mode on the feBlend filter primitive.
5
12
4
6
18
6
svg.elements.feColorMatrix

The SVG filter element changes colors based on a transformation matrix. Every pixel's color value [R,G,B,A] is matrix multiplied by a 5 by 5 color matrix to create new color [R',G',B',A'].
5
12
3
6
18
6
svg.elements.feColorMatrix.in
5
12
3
6
18
6
svg.elements.feColorMatrix.type
5
12
3
6
18
6
svg.elements.feColorMatrix.values
5
12
3
6
18
6
svg.elements.feComponentTransfer

The SVG filter primitive performs color-component-wise remapping of data for each pixel. It allows operations like brightness adjustment, contrast adjustment, color balance or thresholding.
5
12
3
6
18
6
svg.elements.feComponentTransfer.in
5
12
3
6
18
6
svg.elements.feComposite

The SVG filter primitive performs the combination of two input images pixel-wise in image space using one of the Porter-Duff compositing operations: over, in, atop, out, xor, lighter, or arithmetic.
5
≤18
3
6
18
6
svg.elements.feComposite.in
5
≤18
3
6
18
6
svg.elements.feComposite.in2
5
≤18
3
6
18
6
svg.elements.feComposite.k1

The k1 attribute defines one of the values to be used within the arithmetic operation of the feComposite filter primitive.
5
79
3
6
18
6
svg.elements.feComposite.k2

The k2 attribute defines one of the values to be used within the arithmetic operation of the feComposite filter primitive.
5
79
3
6
18
6
svg.elements.feComposite.k3

The k3 attribute defines one of the values to be used within the arithmetic operation of the feComposite filter primitive.
5
79
3
6
18
6
svg.elements.feComposite.k4

The k4 attribute defines one of the values to be used within the arithmetic operation of the feComposite filter primitive.
5
79
3
6
18
6
svg.elements.feComposite.operator
5
≤18
3
6
18
6
svg.elements.feComposite.operator.lighter_value

`lighter` value
41
79
86
10
41
10
svg.elements.feConvolveMatrix

The SVG filter primitive applies a matrix convolution filter effect. A convolution combines pixels in the input image with neighboring pixels to produce a resulting image. A wide variety of imaging operations can be achieved through convolutions, including blurring, edge detection, sharpening, embossing and beveling.
6
12
3
6
18
6
svg.elements.feConvolveMatrix.bias

The bias attribute shifts the range of the filter. After applying the kernelMatrix of the feConvolveMatrix element to the input image to yield a number and applied the divisor attribute, the bias attribute is added to each component. This allows representation of values that would otherwise be clamped to 0 or 1.
6
79
3
6
18
6
svg.elements.feConvolveMatrix.divisor

The divisor attribute specifies the value by which the resulting number of applying the kernelMatrix of a feConvolveMatrix element to the input image color value is divided to yield the destination color value.
6
79
3
6
18
6
svg.elements.feConvolveMatrix.edgeMode

The edgeMode attribute determines how to extend the input image as necessary with color values so that the matrix operations can be applied when the kernel is positioned at or near the edge of the input image.
6
79
3
6
18
6
svg.elements.feConvolveMatrix.in

The in attribute identifies input for the given filter primitive.
6
12
3
6
18
6
svg.elements.feConvolveMatrix.kernelMatrix

The kernelMatrix attribute defines the list of numbers that make up the kernel matrix for the feConvolveMatrix element.
6
12
3
6
18
6
svg.elements.feConvolveMatrix.kernelUnitLength

The kernelUnitLength attribute has two meanings based on the context it's used in. For lighting filter primitives, it indicates the intended distance for the x and y coordinates, for feConvolveMatrix, it indicates the intended distance between successive columns and rows in the kernel matrix.
6
79
3
6
18
6
svg.elements.feConvolveMatrix.order

The order attribute indicates the size of the matrix to be used by a feConvolveMatrix element.
6
79
3
6
18
6
svg.elements.feConvolveMatrix.preserveAlpha

the preserveAlpha attribute indicates how a feConvolveMatrix element handles alpha transparency.
6
79
3
6
18
6
svg.elements.feConvolveMatrix.targetX

The targetX attribute determines the positioning in horizontal direction of the convolution matrix relative to a given target pixel in the input image. The leftmost column of the matrix is column number zero. The value must be such that: 0 <= targetX < x of order.
6
79
3
6
18
6
svg.elements.feConvolveMatrix.targetY

The targetY attribute determines the positioning in vertical direction of the convolution matrix relative to a given target pixel in the input image. The topmost row of the matrix is row number zero. The value must be such that: 0 <= targetY < y of order.
6
79
3
6
18
6
svg.elements.feDiffuseLighting

The SVG filter primitive lights an image using the alpha channel as a bump map. The resulting image, which is an RGBA opaque image, depends on the light color, light position and surface geometry of the input bump map.
5
12
3
6
18
6
svg.elements.feDiffuseLighting.diffuseConstant

The diffuseConstant attribute represents the kd value in the Phong lighting model. In SVG, this can be any non-negative number.
5
79
3
6
18
6
svg.elements.feDiffuseLighting.in

The in attribute identifies input for the given filter primitive.
5
12
3
6
18
6
svg.elements.feDiffuseLighting.kernelUnitLength

The kernelUnitLength attribute has two meanings based on the context it's used in. For lighting filter primitives, it indicates the intended distance for the x and y coordinates, for feConvolveMatrix, it indicates the intended distance between successive columns and rows in the kernel matrix.
5
79
3
6
18
6
svg.elements.feDiffuseLighting.surfaceScale

The surfaceScale attribute represents the height of the surface for a light filter primitive.
5
79
3
6
18
6
svg.elements.feDisplacementMap

The SVG filter primitive uses the pixel values from the image from in2 to spatially displace the image from in.
5
12
3
6
18
6
svg.elements.feDisplacementMap.in
5
12
3
6
18
6
svg.elements.feDisplacementMap.in2
5
12
3
6
18
6
svg.elements.feDisplacementMap.scale

The scale attribute defines the displacement scale factor to be used on a feDisplacementMap filter primitive. The amount is expressed in the coordinate system established by the primitiveUnits attribute on the filter element.
5
12
3
6
18
6
svg.elements.feDisplacementMap.xChannelSelector

The xChannelSelector attribute indicates which color channel from in2 to use to displace the pixels in in along the x-axis.
5
79
3
6
18
6
svg.elements.feDisplacementMap.yChannelSelector

The yChannelSelector attribute indicates which color channel from in2 to use to displace the pixels in in along the y-axis.
5
79
3
6
18
6
svg.elements.feDistantLight

The SVG element defines a distant light source that can be used within a lighting filter primitive: feDiffuseLighting or feSpecularLighting.
5
≤18
3
6
18
6
svg.elements.feDistantLight.azimuth

The azimuth attribute specifies the direction angle for the light source on the XY plane (clockwise), in degrees from the x axis.
5
79
3
6
18
6
svg.elements.feDistantLight.elevation

The elevation attribute specifies the direction angle for the light source from the XY plane towards the Z-axis, in degrees. Note that the positive Z-axis points towards the viewer of the content.
5
79
3
6
18
6
svg.elements.feDropShadow

The SVG filter primitive creates a drop shadow of the input image. It can only be used inside a filter element.
13
79
30
6
18
6
svg.elements.feDropShadow.dx
13
79
30
6
18
6
svg.elements.feDropShadow.dy
13
79
30
6
18
6
svg.elements.feDropShadow.in
13
79
30
6
18
6
svg.elements.feDropShadow.stdDeviation

The stdDeviation attribute defines the standard deviation for the blur operation.
13
79
30
6
18
6
svg.elements.feFlood

The SVG filter primitive fills the filter subregion with the color and opacity defined by flood-color and flood-opacity.
5
12
3
6
18
6
svg.elements.feFuncA

The SVG filter primitive defines the transfer function for the alpha component of the input graphic of its parent feComponentTransfer element.
5
12
3
6
18
6
svg.elements.feFuncB

The SVG filter primitive defines the transfer function for the blue component of the input graphic of its parent feComponentTransfer element.
5
12
3
6
18
6
svg.elements.feFuncG

The SVG filter primitive defines the transfer function for the green component of the input graphic of its parent feComponentTransfer element.
5
12
3
6
18
6
svg.elements.feFuncR

The SVG filter primitive defines the transfer function for the red component of the input graphic of its parent feComponentTransfer element.
5
12
3
6
18
6
svg.elements.feGaussianBlur

The SVG filter primitive blurs the input image by the amount specified in stdDeviation, which defines the bell-curve.
5
≤18
3
6
18
6
svg.elements.feGaussianBlur.edgeMode
8
8
svg.elements.feGaussianBlur.in
5
≤18
3
6
18
6
svg.elements.feGaussianBlur.stdDeviation

The stdDeviation attribute defines the standard deviation for the blur operation.
5
≤18
3
6
18
6
svg.elements.feImage

The SVG filter primitive fetches image data from an external source and provides the pixel data as output (meaning if the external source is an SVG image, it is rasterized.)
5
12
3
6
18
6
svg.elements.feImage.crossorigin

The crossorigin attribute, valid on the image, feImage, and script elements, provides support for configuration of Cross-Origin Resource Sharing (CORS) requests for the element's fetched data.
114
svg.elements.feImage.href

The href attribute defines a link to a resource as a reference URL. The exact meaning of that link depends on the context of each element using it.
5
12
3
6
18
6
svg.elements.feImage.preserveAspectRatio
5
79
22
6
18
6
svg.elements.feMerge

The SVG element allows filter effects to be applied concurrently instead of sequentially. This is achieved by other filters storing their output via the attribute and then accessing it in a child.
5
12
3
6
18
6
svg.elements.feMergeNode

The SVG takes the result of another filter to be processed by its parent .
5
12
3
6
18
6
svg.elements.feMergeNode.in
5
12
4
6
18
6
svg.elements.feMorphology

The SVG filter primitive is used to erode or dilate the input image. Its usefulness lies especially in fattening or thinning effects.
5
12
3
6
18
6
svg.elements.feMorphology.in
5
12
3
6
18
6
svg.elements.feMorphology.operator
5
12
3
6
18
6
svg.elements.feMorphology.radius

The radius attribute represents the radius (or radii) for the operation on a given feMorphology filter primitive.
5
12
3
6
18
6
svg.elements.feOffset

The SVG filter primitive enables offsetting an input image relative to its current position. The input image as a whole is offset by the values specified in the dx and dy attributes.
5
12
3
6
18
6
svg.elements.feOffset.dx
6
12
3
6
18
6
svg.elements.feOffset.dy
6
12
3
6
18
6
svg.elements.feOffset.in
6
12
3
6
18
6
svg.elements.fePointLight

The SVG element defines a light source which allows to create a point light effect. It can be used within a lighting filter primitive: feDiffuseLighting or feSpecularLighting.
5
12
3
6
18
6
svg.elements.fePointLight.x
5
12
3
6
18
6
svg.elements.fePointLight.y
5
12
3
6
18
6
svg.elements.fePointLight.z
5
12
3
6
18
6
svg.elements.feSpecularLighting

The SVG filter primitive lights a source graphic using the alpha channel as a bump map. The resulting image is an RGBA image based on the light color. The lighting calculation follows the standard specular component of the Phong lighting model. The resulting image depends on the light color, light position and surface geometry of the input bump map. The…
5
12
3
6
18
6
svg.elements.feSpecularLighting.in
5
12
3
6
18
6
svg.elements.feSpecularLighting.kernelUnitLength
45
79
3
17.4
45
17.4
svg.elements.feSpecularLighting.specularConstant

The specularConstant attribute controls the ratio of reflection of the specular lighting. It represents the ks value in the Phong lighting model. The bigger the value the stronger the reflection.
5
12
3
6
18
6
svg.elements.feSpecularLighting.specularExponent
5
12
3
6
18
6
svg.elements.feSpecularLighting.surfaceScale
5
79
3
6
18
6
svg.elements.feSpotLight

The SVG element defines a light source that can be used to create a spotlight effect. It is used within a lighting filter primitive: feDiffuseLighting or feSpecularLighting.
5
12
3
6
18
6
svg.elements.feSpotLight.limitingConeAngle

The limitingConeAngle attribute represents the angle in degrees between the spot light axis (i.e., the axis between the light source and the point to which it is pointing at) and the spot light cone. So it defines a limiting cone which restricts the region where the light is projected. No light is projected outside the cone.
5
12
3
6
18
6
svg.elements.feSpotLight.pointsAtX

The pointsAtX attribute represents the x location in the coordinate system established by attribute primitiveUnits on the filter element of the point at which the light source is pointing.
5
12
3
6
18
6
svg.elements.feSpotLight.pointsAtY

The pointsAtY attribute represents the y location in the coordinate system established by attribute primitiveUnits on the filter element of the point at which the light source is pointing.
5
12
3
6
18
6
svg.elements.feSpotLight.pointsAtZ

The pointsAtZ attribute represents the z location in the coordinate system established by attribute primitiveUnits on the filter element of the point at which the light source is pointing, assuming that, in the initial local coordinate system, the positive z-axis comes out towards the person viewing the content and assuming that one unit along the z-axis…
5
12
3
6
18
6
svg.elements.feSpotLight.specularExponent
5
12
3
6
18
6
svg.elements.feSpotLight.x
5
12
3
6
18
6
svg.elements.feSpotLight.y
5
12
3
6
18
6
svg.elements.feSpotLight.z
5
12
3
6
18
6
svg.elements.feTile

The SVG filter primitive allows to fill a target rectangle with a repeated, tiled pattern of an input image. The effect is similar to the one of a pattern.
5
12
3
6
18
6
svg.elements.feTile.in
5
12
3
6
18
6
svg.elements.feTurbulence

The SVG filter primitive creates an image using the Perlin turbulence function. It allows the synthesis of artificial textures like clouds or marble. The resulting image will fill the entire filter primitive subregion.
5
12
3
6
18
6
svg.elements.feTurbulence.baseFrequency

The baseFrequency attribute represents the base frequency parameter for the noise function of the feTurbulence filter primitive.
5
12
3
6
18
6
svg.elements.feTurbulence.numOctaves

The numOctaves attribute defines the number of octaves for the noise function of the feTurbulence primitive.
5
79
3
6
18
6
svg.elements.feTurbulence.seed

The seed attribute represents the starting number for the pseudo random number generator of the feTurbulence filter primitive.
5
12
3
6
18
6
svg.elements.feTurbulence.stitchTiles

The stitchTiles attribute defines how the Perlin Noise tiles behave at the border.
5
79
3
6
18
6
svg.elements.feTurbulence.type

The type attribute is a generic attribute and it has different meaning based on the context in which it's used.
5
79
3
6
18
6
svg.elements.filter

The SVG element defines a custom filter effect by grouping atomic filter primitives. It is never rendered itself, but must be used by the filter attribute on SVG elements, or the filter CSS property for SVG/HTML elements.
5
12
3
6
18
6
svg.elements.filter.filterUnits

The filterUnits attribute defines the coordinate system for the attributes x, y, width and height.
5
79
3
6
18
6
svg.elements.filter.height

The height attribute defines the vertical length of an element in the user coordinate system.
5
79
3
6
18
6
svg.elements.filter.primitiveUnits

The primitiveUnits attribute specifies the coordinate system for the various length values within the filter primitives and for the attributes that define the filter primitive subregion.
5
79
3
6
18
6
svg.elements.filter.width

The width attribute defines the horizontal length of an element in the user coordinate system.
5
79
3
6
18
6
svg.elements.filter.x

The x attribute defines an x-axis coordinate in the user coordinate system.
5
79
3
6
18
6
svg.elements.filter.y

The y attribute defines a y-axis coordinate in the user coordinate system.
5
79
3
6
18
6
svg.global_attributes.filter

The filter attribute specifies the filter effects defined by the filter element that shall be applied to its element.
≤53
79
35
≤10.1
≤53
≤10.3
svg.global_attributes.flood-color

The flood-color attribute indicates what color to use to flood the current filter primitive subregion.
5
12
3
6
18
6
svg.global_attributes.flood-opacity

The flood-opacity attribute indicates the opacity value to use across the current filter primitive subregion.
5
12
3
6
18
6
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (22)
Notes 1 item(s)
Implementation note
  • Before Edge 79, `BackgroundImage` and `BackgroundAlpha` were supported.
Notes 1 item(s)
Implementation note
  • Before Edge 79, `BackgroundImage` and `BackgroundAlpha` were supported.
Notes 1 item(s)
Implementation note
  • Document fragments (including references to fragments in the current document) are not supported (see bug 455986).
Notes 1 item(s)
Limitation
  • Partially supported, see bug 12382004.
Notes 1 item(s)
Limitation
  • Partially supported, see bug 12382004.
Notes 1 item(s)
Limitation
  • Partially supported, see bug 12382004.

Syntax

HTML 
<filter id="blur">
  <feGaussianBlur in="SourceGraphic"
    stdDeviation="5" />
</filter>
<rect filter="url(#blur)" />

Live demo

or filter

A demo pattern for blur filters in CSS.

PreviewFullscreen

filter

A demo pattern for shadow filters in CSS.

PreviewFullscreen

Colorconvertfilter

A demo pattern for color-transform filters in CSS.

PreviewFullscreen

Use cases

  • Using SVG filters

    The <filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.

Cautions

  • May not be supported in older browsers.

Accessibility

  • Make sure visual changes are conveyed appropriately to assistive technology.

Related links

Powered by web-features