I learned yesterday that someone had made the Firefox logo available as a SVG file for the purposes of putting onto T-Shirts, etc. I decided I'd use this opportunity to gauge the state of SVG renderers available to me, the average lay-person.

For my little impromptu test, I chose 5 platforms: The Adobe SVG Viewer Plugin for IE/Firefox (the de-facto standard), The GIMP 2.2, the latest Mozilla+SVG Build, Amaya 9 and Opera 8 Beta 3 (which supports the SVG Tiny profile only). The results speak for themselves...prepare to stretch your browser window width though as I used large images for the rendering (sorry).

First, the version of the Firefox logo as rendered by Adobe's SVG Viewer plugin (in Internet Explorer and Firefox 1.02):

Actual Firefox Logo Firefox Logo in SVG as rendered by Adobe

Pretty much as I expected, Adobe SVG Viewer renders the logo nearly flawlessly. A couple minor things: Colour of the SVG image is darker than the rasterized version. Also, the drop-shadow seems murky and a little too light in Adobe's version. Finally, look at the "spotlight" glow at the top of the globe. The rasterized version clearly shows the glow's arc beneath the tail while Adobe's version of the arc is lost amidst the darkening shadow. Personally I like the Adobe SVG version better. Btw, reading the SVG source, the image was built and rasterized in Adobe Illustrator 10, so it's interesting that there are differences between two different products from the same company.

Next up at bat is The GIMP 2.2 :

Actual Firefox Logo Firefox Logo in SVG as rendered by The Gimp 2.2

I was really surprised and pleased with GIMP's ability to render the image, something which I only learned about today. Unfortunately, it doesn't get the globe's contents right at all in terms of shading and it fails to render a drop-shadow. Despite these flaws, it's really too bad The GIMP can't save/export an image as SVG as it might be a viable means for me to create some SVGs for my web pages, etc...

Third, we have the latest Mozilla+SVG Build:

Actual Firefox Logo Firefox Logo in SVG as rendered by Mozilla+SVG

You can see that the native implementation of SVG within Mozilla is really coming along, but the biggest glaring problem with this image is that it oddly clips the fox to the globe. The lighting model is also off (though not as bad as The Gimp's).

I attempted to render the SVG in Opera Beta 8 and I didn't expect much, since it is a Beta and only has implemented the Tiny SVG profile. What came out was the outline of the logo with everything filled in as black. What was more surprising was that Amaya 9 rendered things identically to Opera, yet I had thought Amaya was supposed to be a pretty standards-comformant browser. This all makes me question if the SVG of the FF logo is not standards-comformant...

I'd be really curious what other renderers out there are capable of, specifically Batik SVG or KSVG. If you want the actual SVG file that I used you can get it here.

§76 · April 2, 2005 · Software, SVG, Technology · · [Print]

5 Comments to “The State of SVG (2005-04-02)”

  1. Rob says:

    Nice comparison. The benchmark is helpful even if I did have to stretch the browser across both screens. Doesn’t Corel make an SVG plug-in too?

  2. Buy a bigger monitor! 😉 Truly I should have used 300×300 for the image instead of 500×500…

    Corel used to but it’s been completely dropped. I’m sure Adobe’s is much better, so I figured I’d stick with only currently supported versions (Adobe’s may be edging towards “unsupported” soon too though, from what it sounds like).

  3. Holger says:

    hi Jeff
    for screenshots of Batik, Konqueror(KSVG), Opera and inkscape
    ive also uploaded a new version of the logo, which shows correctly in
    all these browser plus mozSVG and ASV.
    you should definitly check out Batik as its one of the most advaced
    implementations out there(doing fonts and filter completely)
    have fun

  4. Thanks Holger. Sorry for all the blocked comments but I have a limit on the number of URLs you can include in comments.

  5. Holger says:

    Hi Jeff
    today ive filed a bug concerning the odd cliping behavior in MozSVG.It took them less than 6 hours to fix it. see: