SVG Filters: ColorMatrix

The Matrix you can enter below will be multiplied against all the color vectors of the image on the right below.

R	G	B	A	1
					R
					G
					B
					A
0	0	0	0	1	1

The SVG filter that is being applied to the image is the following.

<svg width="0" height="0" xmlns="http://www.w3.org/2000/svg">
    <filter id="filterid">
        <feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0 "/>
    </filter>
</svg>

To apply such a filter to an HTML element one simply has to put the SVG filter somewhere in the page and apply it with the following CSS3 code.

img {
   -webkit-filter: url(#filterid);
   filter: url(#filterid);
}