Full version, Basic version

Specification link: 15.9 Filter primitive 'feBlend'

coords-viewattr-03-b ← index → filters-color-01-b

# filters-blend-01-b
SVG Image | PNG Image
filters-blend-01-b Examples of feBlend operations Normal Multiply Multiply Multiply Screen Darken Lighten $Revision: 1.8 $ |

Verify correct operation of the five compositing modes of the feBlend filter primitive. Seven rectangles are blended into a gradient, with text strings identifying which of the the five feBlend modes were used.

All rectangles but the fourth one have a blue fill, although the blend mode will adjust this color. The fourth has a yellow fill.

The third and fourth rectangles are grouped and the filter is applied to the group.

The rendered picture should match the reference image exactly, except for possible variations in the labelling text (per CSS2 rules).

coords-viewattr-03-b ← index → filters-color-01-b