Convert SVG file to multiple different size PNG files

Question

I have a logo image in SVG format and I am wondering if theres a way to generate multiple different sized png files.

Eg, I set 20 different width and height and it generates 20 PNG files. It okay if I have to do it 5 images at a time.

I have illustrator installed and cant figure out how to do this on it.

Thanks for all of your help!

Solution 1

I don't know about Illustrator, but this should be easy using the Inkscape command line options. For example, using Ruby:

$ ruby -e '[10,100,200].each { |x| `inkscape --export-png logo#{x}.png -w #{x} logo.svg` }'

Solution 2

The accepted answer is fine. There is an official help on options available. Also basic Shell commands will do nicely here:

for x in 10 100 200 ; do inkscape --export-png logo${x}.png -w ${x} logo.svg ; done

On the command line in windows use this line from @avalancha in the comments

for %x in (100 200 300) ; do inkscape --export-png logo%x.png -w %x logo.svg ; done

Solution 3

Here's how to make it much faster (3x for me for just 5 exports on an SSD) by launching Inkscape just once, and how to export the images to different directories (as Android uses):

#!/bin/sh
# Converts the Inkscape icon file ic_launcher_web.svg to the launcher web & app png files.

PROJECT="My Project Name"
INPUT="source-assets/ic_launcher_web.svg"
MAIN="${PROJECT}/src/main/"
RES="${MAIN}res/"
DRAWABLE="${RES}/drawable"

inkscape --shell <<COMMANDS
  --export-png "${MAIN}ic_launcher-web.png"         -w 512 "${INPUT}"
  --export-png "${DRAWABLE}-mdpi/ic_launcher.png"   -w  48 "${INPUT}"
  --export-png "${DRAWABLE}-hdpi/ic_launcher.png"   -w  72 "${INPUT}"
  --export-png "${DRAWABLE}-xhdpi/ic_launcher.png"  -w  96 "${INPUT}"
  --export-png "${DRAWABLE}-xxhdpi/ic_launcher.png" -w 144 "${INPUT}"
quit
COMMANDS

This is a bash shell script. On Windows you can run it in MINGW32 (e.g. GitHub's Git Shell) or convert it to a Windows DOS shell script. (For a DOS script, you'll have to change the "here document" COMMANDS into something DOS can handle. See heredoc for Windows batch? for techniques such as echoing multiple lines of text to a temp file.)

Solution 4

Take a look at inkmake. I actually made that tool just for batch exporting SVG files to PNG etc in different sizes. It was design because I wanted to save in Inkscape and then just run inkmake in a terminal and it will export all depending PNG files.

Solution 5

If you haven't already, install imagemagick. On OSX, that requires rsvg support specifically:

brew install imagemagick --with-librsvg

You also need inkscape, otherwise you may find that your images come out all black (except for transparent areas).

brew install homebrew/gui/inkscape

Then, you should be able to convert as follows:

convert -density 1536 -background none -resize 100x100 input.svg output-100.png

The 1536 is a workaround for something I'm not able to find good answers to. In my experiments, omitting the -density argument creates images that are terribly small. Converting an image to -size 100x100 at -density 1024 gives me an output image of 96x96, so what I'm doing instead is overshooting on the density and resizing down to the target size.

TL;DR use a density that is 1500 times larger than your target size, and go from there.

There are many ways to bulk-run that command. Here is one in the shell:

for s in 10 100 200 ; do convert -density 1536 -background none -resize ${s}x${s} input.svg output-${s}.png ; done

View more solutions