SVG feFlood Filter Primitive
feFlood fills the entire filter region with a solid flood-color, providing a color source for other primitives to composite against.
Drop your image here
Supports PNG, JPG, BMP, WEBP up to 5MB
Generating a Solid Color Source
The feFlood primitive fills the entire filter region with a solid color specified by flood-color and flood-opacity, producing a rectangle of color with no dependency on the input graphic — it acts as a raw color source that other primitives like feComposite or feBlend can then combine with the original artwork.
- flood-color and flood-opacity set the solid fill color and transparency
- feFlood ignores the input graphic entirely and fills the whole region
- Acts as a color source for feComposite or feBlend to combine with artwork
Common feFlood Use Cases
feFlood is frequently paired with feComposite using operator="in" to recolor a shape's silhouette with a flat tint, or combined with feBlend to create colored overlay effects, making it a foundational building block for tinting, colorizing, and duotone-style filter effects applied to SVG graphics.
- Pairing with feComposite operator="in" recolors a shape's silhouette
- Combining with feBlend creates colored overlay and duotone effects
- A foundational building block for tinting and colorizing filter chains
Frequently Asked Questions
Does feFlood use the input graphic at all?
No, feFlood completely ignores any input graphic and simply fills the entire filter region with the specified flood-color, acting purely as a color source.
How do I recolor a shape using feFlood?
Combine feFlood with feComposite using operator="in", which clips the flood color to the alpha channel of the shape, effectively recoloring its silhouette.
Related guides
Ready to Convert Your Image to SVG?
Free online converter — no sign-up, no watermarks, results in under 3 seconds.
Try It Free — Convert Image to SVG