Manipulating images and color can either be very rewarding, or somewhat daunting, depending on how simple or complicated we make our processes! Fortunately, PostCSS can help automate a fair degree of our processes, so let's take a moment to consider what we've covered throughout this chapter.

We kicked off with a look at adding media assets, and using PostCSS to automatically update asset links, this helps remove any risk that we inadvertently use the wrong link!

We then moved on to manipulating images, we started with a look at creating image sprites, first using SASS, before transitioning to using PostCSS. Next up came a more in-depth look at altering images, where we used the Evil Icons SVG library and set up PostCSS to alter the color of each icon at compilation. We then moved on to learn about how we can switch in the WebP image format; while most people might use standard format images, we learned how easy it is to switch-in WebP images, when using a supported browser.

Moving on, we then turned our attention to manipulating colors through the use of specific palettes, we covered how you can use PostCSS to compile in human-readable color names, and then mix or manipulate them within our style sheet. We then amped things up a little, with a look at using PostCSS to apply specific color filters, to alter color levels in a chosen color. We then explored some of the disadvantages of using standard plugins, and why we might need to create our own custom filters, that can be applied during compilation of our code. We then rounded out the chapter with a quick look at using some fun Instagram filters, where we can easily see how multiple filters are put together to manipulate images within our site.

Wow, we've certainly covered a lot of content! But our journey doesn't stop there: in the next chapter, we'll take a look at creating grids, which we can then use to construct layouts within our projects.