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.
feMerge
- [Instructor] The feMerge filter primitive allows filter effects to be applied concurrently instead of sequentially, meaning you can control in which order the different filter effects are applied. You achieve this by taking the result attributes from different filters, and then listing them in the order you want them to be applied using individual feMerge node elements. In this example, I've applied the feGaussianBlur filter to the rectangle, and now I want to superimpose the original graphic on top so that this blurred rectangle becomes a drop shadow behind it. In the exercise files, I already have the filter set up, so here we have feGaussianBlur. I've applied it to the SourceAlpha to show you that if you have a graphic that maybe is white, or green, or blue, or something like that, and you don't want to have a white, or green, or blue drop shadow, you would just pull out the alpha layer of the element you're working with, and that alpha layer will always be black, so therefore…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
-
-
A walkthrough of SVG filter primitives2m 11s
-
(Locked)
feImage4m 31s
-
(Locked)
feTile4m 15s
-
(Locked)
feFlood2m 29s
-
(Locked)
feBlend2m 52s
-
(Locked)
feGaussianBlur3m 21s
-
(Locked)
feMerge2m 51s
-
(Locked)
feOffset2m 54s
-
(Locked)
feMorphology4m 39s
-
(Locked)
feComposite4m 50s
-
(Locked)
feComponentTransfer9m 23s
-
(Locked)
feColorMatrix, part 13m 42s
-
(Locked)
feColorMatrix, part 24m 53s
-
(Locked)
feDiffuseLighting7m 53s
-
(Locked)
feSpecularLighting4m 19s
-
(Locked)
feTurbulence6m 47s
-
(Locked)
feDisplacementMap2m 40s
-
(Locked)
feConvolveMatrix5m 49s
-
-
-