< svg‎ | elements
Jump to: navigation, search


This article is In Progress.

Needs Summary: This article does not have a summary. Summaries give a brief overview of the topic and are automatically included on some listing pages that link to this article.

Overview Table

DOM Interface SVGElement


This example shows a simple flood filter that is green colored and has an opacity of 50%.

The image will look like this.

        <svg width="400" height="400">
               <filter id="MyFilter" filterUnits="userSpaceOnUse" x="0" y="0"  width="400" height="400">
                  <feFlood x="100" y="100" width="100" height="100"
                    flood-color="green" flood-opacity="0.5"/>
            <use filter="url(#MyFilter)" x='0' y='0'/>



The purpose of this filter is to provide a rectangular area that can be part of a larger filter chain. If you do not supply a color or opacity, the default values will be used. You can supply the x, y, width, and height values, but if you do not, they will be defined by the general filter region.


Standards information


The SVGFEFloodElement object has these properties:

  • height: Gets or sets the height of an element.
  • result: Provides a reference for the output result of a filter.
  • width: Defines the width of an element.
  • x: Gets or sets the x-coordinate value.
  • y: Gets or sets the y-coordinate value.

See also

Related articles


  • feFlood


This article contains content originally from external sources.

Portions of this content come from the Microsoft Developer Network: [Windows Internet Explorer API reference Article]