kernelMatrix

The kernelMatrix attribute defines the list of numbers that make up the kernel matrix for the <feConvolveMatrix> element.

Values are separated by space characters and/or a comma. The number of entries in the list must equal to <orderX> by <orderY> as defined in the order attribute.

You can use this attribute with the following SVG elements:

Example

<svg viewBox="0 0 420 200" xmlns="http://www.w3.org/2000/svg">
  <filter id="convolveMatrix1" x="0" y="0" width="100%" height="100%">
    <feConvolveMatrix kernelMatrix="1 1 0 0 0 0 0 0 -1"/>
  </filter>
  <filter id="convolveMatrix2" x="0" y="0" width="100%" height="100%">
    <feConvolveMatrix kernelMatrix="-1 0 0 0 0 0 0 0 1"/>
  </filter>

  <image xlink:href="//developer.mozilla.org/files/6457/mdn_logo_only_color.png" width="200" height="200"
      style="filter:url(#convolveMatrix1);"/>
  <image xlink:href="//developer.mozilla.org/files/6457/mdn_logo_only_color.png" width="200" height="200"
      style="filter:url(#convolveMatrix2); transform:translateX(220px);"/>
</svg>

Usage notes

Value <list of numbers>
Default value None
Animatable Yes
<list of numbers>

The list of <number>s that make up the kernel matrix for the convolution. Values are separated by space characters and/or a comma. The number of entries in the list must equal <orderX> times <orderY>.

If the result of orderX * orderY is not equal to the number of entries in the value list, the filter primitive acts as a pass through filter.

Specifications

Specification Status Comment
Filter Effects Module Level 1
The definition of 'kernelMatrix' in that specification.
Working Draft No change
Scalable Vector Graphics (SVG) 1.1 (Second Edition)
The definition of 'kernelMatrix' in that specification.
Recommendation Initial definition

Browser compatibility

BCD tables only load in the browser