From the course: CSS: Images
Join today to access over 22,600 courses taught by industry experts.
Using custom SVG filters
- [Instructor] In addition to the default filters we've already looked at, the filter property has one more trick up its sleeve. You can see it right here at the top. You can use any SVG filter as a filter in CSS. That's because all of these filters, the presets that you've already been looking at, are actually just SVG filters that are built into the browser. That means you can customize your own SVG filters, make them as advanced as you want, and then call them in using the filter property on any element. Let me show you an example of this. Here's an SVG filter generator. This one generates a gradient map which effectively allows you to create dual tone or triple tone pictures. So instead of a black and white picture, you can pick two or three colors and apply them and to get this completely different look. The generator below here generates a filter markup for an SVG. And so all you have to do to apply this filter…
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.