<fecomposite>

This 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 and lighter. Additionally, a component-wise arithmetic operation (with the result clamped between [0..1]) can be applied.

The arithmetic operation is useful for combining the output from the <feDiffuseLighting> and <feSpecularLighting> filters with texture data. If the arithmetic operation is chosen, each result pixel is computed using the following formula:

result = k1*i1*i2 + k2*i1 + k3*i2 + k4

where:

• i1 and i2 indicate the corresponding pixel channel values of the input image, which map to in and in2 respectively
• k1, k2, k3 and k4 indicate the values of the attributes with the same name

Usage context

Categories	Filter primitive element
Permitted content	Any number of the following elements, in any order: <animate>, <set>

Attributes

Global attributes

• Core attributes »
• Presentation attributes »
• Filter primitive attributes »
• class
• style

Specific attributes

• in
• in2
• operator
• k1
• k2
• k3
• k4

DOM Interface

This element implements the SVGFECompositeElement interface.

Specifications

Specification	Status	Comment
Filter Effects Module Level 1 The definition of '<feComposite>' in that specification.	Working Draft	Added lighter value for operator attribute.
Scalable Vector Graphics (SVG) 1.1 (Second Edition) The definition of '<feComposite>' in that specification.	Recommendation	Initial definition

Browser compatibility

See also

• <filter>
• <animate>
• <set>
• <feBlend>
• <feColorMatrix>
• <feComponentTransfer>
• <feConvolveMatrix>
• <feDiffuseLighting>
• <feDisplacementMap>
• <feFlood>
• <feGaussianBlur>
• <feImage>
• <feMerge>
• <feMorphology>
• <feOffset>
• <feSpecularLighting>
• <feTile>
• <feTurbulence>
• SVG tutorial: Filter effects