From the course: SVG: Clipping, Masking, and Filters
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
The filter element
- [Instructor] Just like clipPath and mask, SVG filters are standalone elements added to an SVG element. These filters do not generate graphics on their own, but instead act on any graphic passed to them, which should all be familiar to you by now. An SVG filter starts with the filter element definition, created inside a defs element, and, just like before, to be able to call the filter from a graphic, the filter element needs a unique ID. Inside this filter element, each filtering operation is defined using one or more filter primitives, which are children of the filter element. Filter primitives are easy to spot because the element name starts with the letters 'fe', like feGaussianBlur or feOffset and so on. Each of these filter primitives takes the provided input and performs a single graphical operation, like applying Gaussian blur, producing an output in the form of a new graphic result, and this is what gets displayed. The operation for each filter primitive is defined in…
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.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.