ImageMagick to convert SVG to PNG with transparent background
I am using ImageMagick via the command line to convert a simple SVG to PNG with a transparent background, but it doesn't work for some reason.
I've already tried some of the marked suggestions 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 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
(works 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 right (or at all)?
EDIT
Adding this bit of information from Timo's suggestion: Verbose Output to see where ImageMagick delegates the conversion. It looks like using inkscape, which I've pretty much confirmed (actually using inkscape directly) doesn't render the 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 Inkscape 0.48.2 r9819
TIDE
source to share
You do it right, I just tried the two teams that you have provided ( convert -background none in.svg out.png
and convert -background transparent in.svg
), and they both create a good PNG with a transparent background for me.
Here are 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 can run commands with an optional parameter -verbose
. This will show you if the + which for the "ImageMagick" application is used to handle SVG: "
convert -verbose -background none in.svg out.png
Sorry, I can't help anymore.
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
source to share