From the course: SVG: Clipping, Masking, and Filters

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

feFlood

feFlood

From the course: SVG: Clipping, Masking, and Filters

Start my 1-month free trial

feFlood

- [Instructor] The feFlood filter primitive quite literally floods the filter subregion with a color and opacity defined using flood-color and flood-opacity. You can see how that works by unchecking this filter URL, the filter up here in the file, and going down and taking a look at the filter declared. Here we have the feFlood filter primitive. Again, we have set x, y, width, and height for the filter primitive to control where it displays, and then we have these two attributes, flood-color, and flood-opacity. Flood-color is any CSS color, so you can use either declared names for CSS colors or you can use hex values for CSS colors, and flood-opacity is a number between 0 and one where 0 is completely transparent and one is completely solid. So right now, I've set the flood color to green and opacity one, meaning we should get a solid green color. Then I want to apply it to an element, so I'll start by applying it to the rectangle. That's what we've done up here. Save and go back in…

Contents