apike.ca

feFlood (SVG Filter Effect)

By mbystedt on Mar 1, 2014, 12:09:07 AM

The flood filter effect is used to fills the filter area with a color. It draws a nice rectangle in the color and opacity picked. The area filled can be set using the x, y, width and height attributes that are common to all filters.

<feFlood>
Attribute
Comments
flood-color
The color to flood. This must be a color and not a paint.
flood-opacity
The opacity of the flooded color.
<defs>
    <filter id="blackFlood" >
      <feFlood flood-color="black" flood-opacity=".5" />
  </filter>
 
  <filter id="blackFloodMerge" >
    <feFlood flood-color="black" flood-opacity=".5" result="flood" />
    <feMerge>
      <feMergeNode in="flood" />
      <feMergeNode in="SourceGraphic" />
    </feMerge>
  </filter>
</defs>
Example 1. Two flood filter effects. (Download)

See: Filter Effect Common Attributes

There is no live demo as this effect has no options to showcase.

Related Topics