🏠 New in High Baseline Support: SVG filters
January 29, 2018
The <filter> SVG element applies custom effects such as color manipulation, blurring, or morphing to SVG elements.
Source features
api.SVGFEBlendElement[mdn]api.SVGFEBlendElement.height[mdn]api.SVGFEBlendElement.in1[mdn]api.SVGFEBlendElement.in2[mdn]api.SVGFEBlendElement.mode[mdn]api.SVGFEBlendElement.result[mdn]api.SVGFEBlendElement.width[mdn]api.SVGFEBlendElement.x[mdn]api.SVGFEBlendElement.y[mdn]api.SVGFEColorMatrixElement[mdn]api.SVGFEColorMatrixElement.height[mdn]api.SVGFEColorMatrixElement.in1[mdn]api.SVGFEColorMatrixElement.result[mdn]api.SVGFEColorMatrixElement.type[mdn]api.SVGFEColorMatrixElement.values[mdn]api.SVGFEColorMatrixElement.width[mdn]api.SVGFEColorMatrixElement.x[mdn]api.SVGFEColorMatrixElement.y[mdn]api.SVGFEComponentTransferElement[mdn]api.SVGFEComponentTransferElement.in1[mdn]api.SVGFECompositeElement[mdn]api.SVGFECompositeElement.height[mdn]api.SVGFECompositeElement.in1[mdn]api.SVGFECompositeElement.in2[mdn]api.SVGFECompositeElement.k1[mdn]api.SVGFECompositeElement.k2[mdn]api.SVGFECompositeElement.k3[mdn]api.SVGFECompositeElement.k4[mdn]api.SVGFECompositeElement.operator[mdn]api.SVGFECompositeElement.result[mdn]api.SVGFECompositeElement.width[mdn]api.SVGFECompositeElement.x[mdn]api.SVGFECompositeElement.y[mdn]api.SVGFEDiffuseLightingElement[mdn]api.SVGFEDiffuseLightingElement.diffuseConstant[mdn]api.SVGFEDiffuseLightingElement.height[mdn]api.SVGFEDiffuseLightingElement.in1[mdn]api.SVGFEDiffuseLightingElement.kernelUnitLengthX[mdn]api.SVGFEDiffuseLightingElement.kernelUnitLengthY[mdn]api.SVGFEDiffuseLightingElement.result[mdn]api.SVGFEDiffuseLightingElement.surfaceScale[mdn]api.SVGFEDiffuseLightingElement.width[mdn]api.SVGFEDiffuseLightingElement.x[mdn]api.SVGFEDiffuseLightingElement.y[mdn]api.SVGFEDisplacementMapElement[mdn]api.SVGFEDisplacementMapElement.height[mdn]api.SVGFEDisplacementMapElement.in1[mdn]api.SVGFEDisplacementMapElement.in2[mdn]api.SVGFEDisplacementMapElement.result[mdn]api.SVGFEDisplacementMapElement.scale[mdn]api.SVGFEDisplacementMapElement.width[mdn]api.SVGFEDisplacementMapElement.x[mdn]api.SVGFEDisplacementMapElement.xChannelSelector[mdn]api.SVGFEDisplacementMapElement.y[mdn]api.SVGFEDisplacementMapElement.yChannelSelector[mdn]api.SVGFEDistantLightElement[mdn]api.SVGFEDistantLightElement.azimuth[mdn]api.SVGFEDistantLightElement.elevation[mdn]api.SVGFEFloodElement[mdn]api.SVGFEFuncAElement[mdn]api.SVGFEFuncBElement[mdn]api.SVGFEFuncGElement[mdn]api.SVGFEFuncRElement[mdn]api.SVGFEGaussianBlurElement[mdn]api.SVGFEGaussianBlurElement.in1[mdn]api.SVGFEGaussianBlurElement.setStdDeviation[mdn]api.SVGFEGaussianBlurElement.stdDeviationX[mdn]api.SVGFEGaussianBlurElement.stdDeviationY[mdn]api.SVGFEImageElement[mdn]api.SVGFEImageElement.height[mdn]api.SVGFEImageElement.href[mdn]api.SVGFEImageElement.result[mdn]api.SVGFEImageElement.width[mdn]api.SVGFEImageElement.x[mdn]api.SVGFEImageElement.y[mdn]api.SVGFEMergeElement[mdn]api.SVGFEMergeElement.height[mdn]api.SVGFEMergeElement.result[mdn]api.SVGFEMergeElement.width[mdn]api.SVGFEMergeElement.x[mdn]api.SVGFEMergeElement.y[mdn]api.SVGFEMergeNodeElement[mdn]api.SVGFEMergeNodeElement.in1[mdn]api.SVGFEMorphologyElement[mdn]api.SVGFEMorphologyElement.height[mdn]api.SVGFEMorphologyElement.in1[mdn]api.SVGFEMorphologyElement.operator[mdn]api.SVGFEMorphologyElement.radiusX[mdn]api.SVGFEMorphologyElement.radiusY[mdn]api.SVGFEMorphologyElement.result[mdn]api.SVGFEMorphologyElement.width[mdn]api.SVGFEMorphologyElement.x[mdn]api.SVGFEMorphologyElement.y[mdn]api.SVGFEOffsetElement[mdn]api.SVGFEOffsetElement.dx[mdn]api.SVGFEOffsetElement.dy[mdn]api.SVGFEOffsetElement.height[mdn]api.SVGFEOffsetElement.in1[mdn]api.SVGFEOffsetElement.result[mdn]api.SVGFEOffsetElement.width[mdn]api.SVGFEOffsetElement.x[mdn]api.SVGFEOffsetElement.y[mdn]api.SVGFEPointLightElement[mdn]api.SVGFEPointLightElement.x[mdn]api.SVGFEPointLightElement.y[mdn]api.SVGFEPointLightElement.z[mdn]api.SVGFESpecularLightingElement[mdn]api.SVGFESpecularLightingElement.height[mdn]api.SVGFESpecularLightingElement.in1[mdn]api.SVGFESpecularLightingElement.result[mdn]api.SVGFESpecularLightingElement.specularConstant[mdn]api.SVGFESpecularLightingElement.specularExponent[mdn]api.SVGFESpecularLightingElement.surfaceScale[mdn]api.SVGFESpecularLightingElement.width[mdn]api.SVGFESpecularLightingElement.x[mdn]api.SVGFESpecularLightingElement.y[mdn]api.SVGFESpotLightElement[mdn]api.SVGFESpotLightElement.limitingConeAngle[mdn]api.SVGFESpotLightElement.pointsAtX[mdn]api.SVGFESpotLightElement.pointsAtY[mdn]api.SVGFESpotLightElement.pointsAtZ[mdn]api.SVGFESpotLightElement.specularExponent[mdn]api.SVGFESpotLightElement.x[mdn]api.SVGFESpotLightElement.y[mdn]api.SVGFESpotLightElement.z[mdn]api.SVGFETileElement[mdn]api.SVGFETileElement.height[mdn]api.SVGFETileElement.in1[mdn]api.SVGFETileElement.result[mdn]api.SVGFETileElement.width[mdn]api.SVGFETileElement.x[mdn]api.SVGFETileElement.y[mdn]api.SVGFETurbulenceElement[mdn]api.SVGFETurbulenceElement.baseFrequencyX[mdn]api.SVGFETurbulenceElement.baseFrequencyY[mdn]api.SVGFETurbulenceElement.height[mdn]api.SVGFETurbulenceElement.numOctaves[mdn]api.SVGFETurbulenceElement.result[mdn]api.SVGFETurbulenceElement.seed[mdn]api.SVGFETurbulenceElement.stitchTiles[mdn]api.SVGFETurbulenceElement.type[mdn]api.SVGFETurbulenceElement.width[mdn]api.SVGFETurbulenceElement.x[mdn]api.SVGFETurbulenceElement.y[mdn]api.SVGFilterElement[mdn]api.SVGFilterElement.filterUnits[mdn]api.SVGFilterElement.height[mdn]api.SVGFilterElement.href[mdn]api.SVGFilterElement.primitiveUnits[mdn]api.SVGFilterElement.width[mdn]api.SVGFilterElement.x[mdn]api.SVGFilterElement.y[mdn]svg.elements.feColorMatrix[mdn]svg.elements.feColorMatrix.in[mdn]svg.elements.feColorMatrix.type[mdn]svg.elements.feColorMatrix.values[mdn]svg.elements.feComponentTransfer[mdn]svg.elements.feComponentTransfer.in[mdn]svg.elements.feDiffuseLighting[mdn]svg.elements.feDiffuseLighting.in[mdn]svg.elements.feDisplacementMap[mdn]svg.elements.feDisplacementMap.in[mdn]svg.elements.feDisplacementMap.in2[mdn]svg.elements.feDisplacementMap.scale[mdn]svg.elements.feFlood[mdn]svg.elements.feFlood.flood-color[mdn]svg.elements.feFuncA[mdn]svg.elements.feFuncB[mdn]svg.elements.feFuncG[mdn]svg.elements.feFuncR[mdn]svg.elements.feImage[mdn]svg.elements.feImage.href[mdn]svg.elements.feMerge[mdn]svg.elements.feMergeNode[mdn]svg.elements.feMorphology[mdn]svg.elements.feMorphology.in[mdn]svg.elements.feMorphology.operator[mdn]svg.elements.feMorphology.radius[mdn]svg.elements.feOffset[mdn]svg.elements.fePointLight[mdn]svg.elements.fePointLight.x[mdn]svg.elements.fePointLight.y[mdn]svg.elements.fePointLight.z[mdn]svg.elements.feSpecularLighting[mdn]svg.elements.feSpecularLighting.in[mdn]svg.elements.feSpecularLighting.specularConstant[mdn]svg.elements.feSpecularLighting.specularExponent[mdn]svg.elements.feSpotLight[mdn]svg.elements.feSpotLight.limitingConeAngle[mdn]svg.elements.feSpotLight.pointsAtX[mdn]svg.elements.feSpotLight.pointsAtY[mdn]svg.elements.feSpotLight.pointsAtZ[mdn]svg.elements.feSpotLight.specularExponent[mdn]svg.elements.feSpotLight.x[mdn]svg.elements.feSpotLight.y[mdn]svg.elements.feSpotLight.z[mdn]svg.elements.feTile[mdn]svg.elements.feTile.in[mdn]svg.elements.feTurbulence[mdn]svg.elements.feTurbulence.baseFrequency[mdn]svg.elements.feTurbulence.seed[mdn]svg.elements.filter[mdn]svg.global_attributes.flood-color[mdn]svg.global_attributes.flood-opacity[mdn]svg.elements.feBlend[mdn]svg.elements.feBlend.in[mdn]svg.elements.feBlend.in2[mdn]svg.elements.feBlend.mode[mdn]svg.elements.feMergeNode.in[mdn]api.SVGFEImageElement.preserveAspectRatio[mdn]api.SVGFEComponentTransferElement.height[mdn]api.SVGFEComponentTransferElement.result[mdn]api.SVGFEComponentTransferElement.width[mdn]api.SVGFEComponentTransferElement.x[mdn]api.SVGFEComponentTransferElement.y[mdn]api.SVGFEGaussianBlurElement.height[mdn]api.SVGFEGaussianBlurElement.result[mdn]api.SVGFEGaussianBlurElement.width[mdn]api.SVGFEGaussianBlurElement.x[mdn]api.SVGFEGaussianBlurElement.y[mdn]api.SVGFEFloodElement.height[mdn]api.SVGFEFloodElement.result[mdn]api.SVGFEFloodElement.width[mdn]api.SVGFEFloodElement.x[mdn]api.SVGFEFloodElement.y[mdn]api.SVGFEConvolveMatrixElement[mdn]api.SVGFEConvolveMatrixElement.bias[mdn]api.SVGFEConvolveMatrixElement.divisor[mdn]api.SVGFEConvolveMatrixElement.edgeMode[mdn]api.SVGFEConvolveMatrixElement.height[mdn]api.SVGFEConvolveMatrixElement.in1[mdn]api.SVGFEConvolveMatrixElement.kernelMatrix[mdn]api.SVGFEConvolveMatrixElement.kernelUnitLengthX[mdn]api.SVGFEConvolveMatrixElement.kernelUnitLengthY[mdn]api.SVGFEConvolveMatrixElement.orderX[mdn]api.SVGFEConvolveMatrixElement.orderY[mdn]api.SVGFEConvolveMatrixElement.preserveAlpha[mdn]api.SVGFEConvolveMatrixElement.result[mdn]api.SVGFEConvolveMatrixElement.targetX[mdn]api.SVGFEConvolveMatrixElement.targetY[mdn]api.SVGFEConvolveMatrixElement.width[mdn]api.SVGFEConvolveMatrixElement.x[mdn]api.SVGFEConvolveMatrixElement.y[mdn]svg.elements.feConvolveMatrix[mdn]svg.elements.feConvolveMatrix.in[mdn]svg.elements.feConvolveMatrix.kernelMatrix[mdn]svg.elements.feOffset.dx[mdn]svg.elements.feOffset.dy[mdn]svg.elements.feOffset.in[mdn]svg.elements.feComposite[mdn]svg.elements.feComposite.in[mdn]svg.elements.feComposite.in2[mdn]svg.elements.feComposite.operator[mdn]svg.elements.feDistantLight[mdn]svg.elements.feGaussianBlur[mdn]svg.elements.feGaussianBlur.in[mdn]svg.elements.feGaussianBlur.stdDeviation[mdn]svg.elements.feDiffuseLighting.diffuseConstant[mdn]svg.elements.feDiffuseLighting.kernelUnitLength[mdn]svg.elements.feDiffuseLighting.surfaceScale[mdn]svg.elements.feDisplacementMap.xChannelSelector[mdn]svg.elements.feDisplacementMap.yChannelSelector[mdn]svg.elements.feDistantLight.azimuth[mdn]svg.elements.feDistantLight.elevation[mdn]svg.elements.feFlood.flood-opacity[mdn]svg.elements.feSpecularLighting.surfaceScale[mdn]svg.elements.feTurbulence.numOctaves[mdn]svg.elements.feTurbulence.stitchTiles[mdn]svg.elements.feTurbulence.type[mdn]svg.elements.filter.filterUnits[mdn]svg.elements.filter.height[mdn]svg.elements.filter.primitiveUnits[mdn]svg.elements.filter.width[mdn]svg.elements.filter.x[mdn]svg.elements.filter.y[mdn]svg.elements.feImage.preserveAspectRatio[mdn]svg.elements.feConvolveMatrix.bias[mdn]svg.elements.feConvolveMatrix.divisor[mdn]svg.elements.feConvolveMatrix.edgeMode[mdn]svg.elements.feConvolveMatrix.kernelUnitLength[mdn]svg.elements.feConvolveMatrix.order[mdn]svg.elements.feConvolveMatrix.preserveAlpha[mdn]svg.elements.feConvolveMatrix.targetX[mdn]svg.elements.feConvolveMatrix.targetY[mdn]api.SVGFEDropShadowElement[mdn]api.SVGFEDropShadowElement.dx[mdn]api.SVGFEDropShadowElement.dy[mdn]api.SVGFEDropShadowElement.height[mdn]api.SVGFEDropShadowElement.in1[mdn]api.SVGFEDropShadowElement.result[mdn]api.SVGFEDropShadowElement.setStdDeviation[mdn]api.SVGFEDropShadowElement.stdDeviationX[mdn]api.SVGFEDropShadowElement.stdDeviationY[mdn]api.SVGFEDropShadowElement.width[mdn]api.SVGFEDropShadowElement.x[mdn]api.SVGFEDropShadowElement.y[mdn]svg.elements.feDropShadow[mdn]svg.elements.feDropShadow.dx[mdn]svg.elements.feDropShadow.dy[mdn]svg.elements.feDropShadow.in[mdn]svg.elements.feDropShadow.stdDeviation[mdn]svg.global_attributes.filter[mdn]svg.elements.feComposite.k1[mdn]svg.elements.feComposite.k2[mdn]svg.elements.feComposite.k3[mdn]svg.elements.feComposite.k4[mdn]svg.elements.feComposite.operator.lighter_value[mdn]api.SVGFESpecularLightingElement.kernelUnitLengthX[mdn]api.SVGFESpecularLightingElement.kernelUnitLengthY[mdn]svg.elements.feSpecularLighting.kernelUnitLength[mdn]css.properties.filter.svg_elements[mdn]api.SVGFEGaussianBlurElement.edgeMode[mdn]svg.elements.feGaussianBlur.edgeMode[mdn]api.SVGFEImageElement.crossOrigin[mdn]svg.elements.feImage.crossorigin[mdn]