Full version, Basic version

Specification link: 15.10 Filter primitive 'feColorMatrix'

filters-blend-01-b ← index → filters-composite-02-b

# filters-color-01-b
SVG Image | PNG Image
filters-color-01-b Test which verifies the basic facilities of feColorMatrix. Example feColorMatrix - Examples of feColorMatrix operations Five rectangles filled with a gradient showing the effects of feColorMatrix: an unfiltered rectangle acting as a reference, use of the feColorMatrix matrix option to convert to grayscale, use of the feColorMatrix saturate option, use of the feColorMatrix hueRotate option, and use of the feColorMatrix luminanceToAlpha option. Unfiltered type="matrix" (grayscale matrix) type="saturate" values=".4" type="hueRotate" values="90" type="luminanceToAlpha" $Revision: 1.6 $ |

Test which verifies the basic facilities of feColorMatrix.

This test uses the following elements : a nested <svg> with a viewBox attribute, <linearGradient>, <filter>, <feColorMatrix>, <feComposite>.

The test case shows five rectangles filled with a gradient showing the effects of feColorMatrix: an unfiltered rectangle acting as a reference, use of the feColorMatrix matrix option to convert to grayscale, use of the feColorMatrix saturate option, use of the feColorMatrix hueRotate option, and use of the feColorMatrix luminanceToAlpha option.

The test is somewhat self-explanatory as the strings document the type of feColorMatrix operation that is being used.

filters-blend-01-b ← index → filters-composite-02-b