Friday, November 16, 2007

Sepia Image Filtering Using SVG

I couldn't find a sample of how to do this anywhere on the web, so I thought I'd contribute something useful to society by posting it. Hopefully the next person who Googles it will turn up my page, and it will save them some time. Knowing how heavily used SVG is, it may never happen, but at least I feel like I've done something beneficial to the world.

Dave's SVG Sepia Filter Demo


Jeff Schiller said...

Looks great - Thank You!

Just curious why you didn't also test in Firefox 3 (which supports feColorMatrix) ? I guess "Camino Trunk" is close enough (maybe you can just put "Firefox 3" next to that so that people know.

Jeff Schiller said...

Btw, I had a similar demo for a greyscale effect here:

emd said...

Dave, can those defs go in CSS?

Dave said...

Nope, those defs go in the svg tag of the svg file. Check out the svg spec linked in the post above to see what's going on.