ImageMagick to convert SVG to PNG with transparent background

Question

I'm using ImageMagick via command line to convert a simple SVG to PNG with a transparent background, but for some reason it's not working.

I've already tried some of the suggestions noted here (both convert -background none in.svg out.png and convert -background transparent in.svg out.png) but no luck.

Here's the source for the SVG:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
    xmlns="http://www.w3.org/2000/svg"
    width="130" height="130"
    stroke-width="8"
    stroke="#303030" stroke-linejoin="round"
    style="background-color: rgba(255,255,255,0);"
>
<g transform="translate(65,65)">
    <path fill="red" d="M60,0 h-120 a60,60 0 0 1 120,0" />
    <path fill="white" d="M60,0 h-120 a60,60 0 0 0 120,0" />
    <circle fill="white" r="20" />
    <circle stroke-width="2" fill="white" r="10" />
</g>
</svg>

Here's the version output for ImageMagick convert (running on Mac OS X 10.7.3):

calyodelphi@dragonpad:~/pokemon-story $ convert -version
Version: ImageMagick 6.8.9-0 Q16 x86_64 2014-04-22 http://www.imagemagick.org
Copyright: Copyright (C) 1999-2014 ImageMagick Studio LLC
Features: DPC Modules
Delegates: bzlib djvu fftw fontconfig freetype gslib jng jpeg lcms ltdl lzma png ps tiff webp x xml zlib

Any ideas on what I'm not doing correct (or at all)?

EDIT

Adding this bit of info from Timo's suggestion: verbose output to see where ImageMagick is delegating the conversion. Looks like it's using inkscape, which I've pretty much confirmed (by actually using inkscape directly myself) does not successfully render a transparent background.

calyodelphi@dragonpad:~/pokemon-story $ convert -verbose -background transparent wiki-logo.svg wiki-logo-trans.png 
"inkscape" "wiki-logo.svg" --export-png="/var/tmp/magick-232uT59InIw0vnO" --export-dpi="90,90" --export-background="rgb(0%,0%,0%)" --export-background-opacity="0" > "/var/tmp/magick-232vUkxcro2TpS3" 2>&1
mvg:/var/tmp/magick-232yXpy3JTgdpkm=>/var/tmp/magick-232yXpy3JTgdpkm MVG 130x130 130x130+0+0 16-bit sRGB 552B 0.010u 0:00.000
wiki-logo.svg SVG 130x130 130x130+0+0 16-bit sRGB 552B 0.000u 0:00.000
wiki-logo.svg=>wiki-logo-trans.png SVG 130x130 130x130+0+0 16-bit sRGB 10.6KB 0.000u 0:00.009

Inkscape version is Inkscape 0.48.2 r9819

TIDE

Brantbrantford

for anyone else despairing of this: check that you put the -background parameter first, before any file argument! – Comeon

Answer 1

You are doing it correctly, I just tried the two commands that you provided (convert -background none in.svg out.png and convert -background transparent in.svg) and they both produce a nice PNG with transparent background for me.

Here are the two output images:

     

My version info (on OS X 10.10.1):

Version: ImageMagick 6.8.9-8 Q16 x86_64 2014-10-23 http://www.imagemagick.org
Copyright: Copyright (C) 1999-2014 ImageMagick Studio LLC
Features: DPC Modules
Delegates: bzlib freetype jng jpeg ltdl lzma png xml zlib

You could run the commands with an additional -verbose parameter. This will show you if + which exernal 'delegate' software ImageMagick employes for the SVG processing:

convert -verbose -background none in.svg out.png

Sorry I couldn't be of more help.

EDIT: Here is my verbose output:

➜  /tmp  convert -background transparent -verbose in.svg out2.png
"inkscape" "in.svg" --export-eps="/var/tmp/magick-71670YVLm4mRNHwOZ" --export-dpi="90,90" --export-background="rgb(0%,0%,0%)" --export-background-opacity="0" > "/var/tmp/magick-71670DClhbmEIL8wY" 2>&1
mvg:/var/tmp/magick-71670MHFJb-BHacGd=>/var/tmp/magick-71670MHFJb-BHacGd MVG 130x130 130x130+0+0 16-bit sRGB 552B 0.000u 0:00.000
in.svg MVG 130x130 130x130+0+0 16-bit sRGB 552B 0.000u 0:00.000
in.svg=>out2.png MVG 130x130 130x130+0+0 16-bit sRGB 10.6KB 0.010u 0:00.009

Monto

@CalyoDelphi: I confirm Timo's result. My IM version is 6.9.0-0 Q16 x86_64 2014-12-06 on Mac OS X 10.9.5. – Flickinger

Answer 2

Couldn't it just be that the image has a white background, so it will never be transparent?

style="background-color: rgba(255,255,255,0);"

Derosier

The color is set using rgb-alpha, so the alpha value is 0, meaning that the background is transparent. – Heir

Answer 3

This was still a problem for me in 2022. I found that replacing

  <delegate decode="svg:decode" stealth="True" command="&quot;inkscape&quot; &quot;%s&quot; --export-png=&quot;%s&quot; --export-dpi=&quot;%s&quot; --export-background=&quot;%s&quot; --export-background-opacity=&quot;255&quot; &gt; &quot;%s&quot; 2&gt;&amp;1"/>

with

  <delegate decode="svg:decode" stealth="True" command="&quot;inkscape&quot; &quot;%s&quot; --export-filename=&quot;%s&quot; --export-dpi=&quot;%s&quot; --export-background-opacity=0 2&gt;&amp;1"/>

in /etc/ImageMagick-6/delegates.xml does the trick.

Weatherworn

Answer 4

This command works fine for me in Imagemagick 6.9.12-50 Q16 Mac OSX Monterey using your SVG file.

convert -background none test.svg x.png

Perhaps you need to upgrade your Imagemagick or install Inkscape to be used by Imagemagick for rendering SVG.

Cp