SVG Filter Effects—3 Simple Filter Primitives

For the last few weeks I’ve been talking about filters in SVG. I showed you the basics, talked in more detail about the filter element, and last week I discussed the input and output of filter primitives. What I haven’t yet done is talk about any of the primitives in detail.

Continue reading

SVG Filter Primitives—Input and Output

SVG filter primitives are the building blocks to create the effect you desire. You can use multiple primitives inside a single filter for more interesting effects, however, you need to make the different primitives aware of each other.

Continue reading

The SVG Filter Element

SVG filter effects apply graphic operations to images and elements in nondestructive ways. You can add filters to any SVG element or text and even to bitmapped images. Because SVG filters are nondestructive the original image is never changed and you can return to it by removing any filters you’ve added.

Continue reading

An Introduction To SVG Filters

If I asked you to blur an image or make color adjustments to it, you’d probably reach for your favorite image or graphic editing program and rightly so. Effects like these have been created in image editors for years. However, some can now be created without the editor and through code alone.

Continue reading

How To Write Your Own Custom Sass Functions

If you’ve built more than a handful of websites, you’ve probably noticed you can easily repeat code in a project and across multiple projects. Repeating the same code over and over wastes your time and increases the possibility of introducing errors. In a previous series on Sass, I said mixins were one option for reusing styles and writing DRYer code. Functions are another way to do the same.

Continue reading