This post is the first in a series about the power of CSS.
- Colorizing SVG Backgrounds (this post)
- Dropdown Menus
- Logical Styling Based On the Number of Given Elements
CSS is getting increasingly powerful, and with features like CSS grid and custom properties (also known as CSS variables), we’re seeing some really creative solutions emerging. The possibilities are still being explored on what CSS can do to make writing UI’s simpler, and that’s exciting!
One of those is now one of my favorite CSS features: filters. Let’s look at how we can use filters to solve a problem you may have encountered when working with SVG as a background image on an element.