Multiple Filters for Single Object in SVG

Question

I want to put two filters on my circle. (Maybe more)

I've tried doing:

filter="url(#f1);url(#f2)"

And:

filter="url(#f1,#f2)"

And:

filter="url(#f1 #f2)"

But none of them work. How can I approach this problem?

Answer 1

I know this is a very old question, but for people referencing this, you can also just separate your filter functions with spaces - filter="url(#f1) url(#f2)" should work

See: https://css-tricks.com/almanac/properties/f/filter/

Answer 2

Start with an identity feColorMatrix and name the result currentGraphic for example. Use that as 'in' for each filter element bundle/transaction start and as 'result' for the final operation of the bundle. The next element bundle picks it up at 'in'='currentGraphic', etc.