39

I have bunch of SVG icons that I'd like to use for my application to be developed in VB.Net 2010, and since it has no support to handle SVG icons, I need to convert those icons into either PNG or ICO, with preferred output resolution. I've found such command-line tool for Ubuntu called rsvgconvert. Do we have any such tool for Windows as well??

13 Answers 13

14

ImageMagick has a command line tool that is available for Linux and Windows (and others). The converter tool is conveniently called "convert". Here's some usage documentation.

And here's where you can get a Windows installer.

3
  • 1
    You can also get it via the Windows Subsystem for Linux (WSL), with apt install imagemagick
    – antonyh
    May 9, 2017 at 12:12
  • (this applies to linux, may apply to windows) if you turn -verbose on IM then it would appear that IM itself uses inkscape to create an intermediate eps file. therefore i would suggest @zetah's answer Aug 9, 2017 at 18:07
  • Here's a small ImageMagick based converter for Windows: fosshub.com/SVG2PNG.html It's old (from 2014), but still works and you don't have to read any docs.
    – Pugsley
    Jun 4, 2018 at 10:50
31

ImageMagick should not immediately associate to just any batch task involving images. Especially in this case where ImageMagick is poor solution for SVG conversion.

Better try Inkscape on command line:

inkscape in.svg --export-type=png --export-filename=out.png

6
  • 12
    Why do you say inkscape is better than ImageMagick? I don't disagree (or agree), just curious for more details.
    – Sam
    May 24, 2014 at 17:29
  • The reason being imageMagick is suited to better handle png,jpg etc.. while inkscape is better suited to handle vector images (svg)
    – user93
    Jul 14, 2016 at 7:11
  • 1
    As it stands, this does not answer the question about batch converting, does it? Apr 24, 2017 at 9:26
  • While the answer works, on Windows InkScape insists on showing a focus-grabbing splash screen with a delay, which makes it impossible to run this in batch mode in the background.
    – Timwi
    Jun 11, 2017 at 9:52
  • 2
    This is from Image Magic site: ImageMagick utilizes inkscape if its in your execution path otherwise RSVG. If neither are available, ImageMagick reverts to its internal SVG renderer. Guys from IM know that InkScape converter is better than other tools and they use try to use it first for SVG conversion. Dec 3, 2020 at 9:14
8

The command line did not work out of the box, plus I wanted 100 files to be converted. Here is how I made it work with windows 7:

  1. install inkscape - not the portable one!

  2. copy all your svg files in one folder, e.g. "C:\svgs\" there:

  3. you create a convert.bat file with this line inside:

    FOR %%A IN (*.svg) DO "C:\Program Files (x86)\Inkscape\inkscape.exe" --export-png=%%A.png
    

    (point to the correct folder of your installation):

  4. open the CMD as admin! To do so, hit the WIN key, type cmd, right click on "cmd.exe" and select "Run as administrator".

  5. navigate to your "C:\svgs\" and type convert.bat -- All svg-files will be converted to PNGs.

  6. Use Windows Explorer to search for the converted PNG files. On my PC they were in folder: C:\Users\myname\AppData\Local\VirtualStore\Program Files (x86)\Inkscape\svgs

Hope that helps.


As the resolution for the command line could only be set fixed as far as I could see, I ended up using the InkscapeBatch tool. There I could set the DPI to increase all images relatively.

You need to specify the correct settings or it will not work. Here is what I did:

enter image description here

enter image description here

After you hit "Finish", you need to press the button "Start batch converter..." in the toolbar:

enter image description here

8
  • 2
    Your batch command is probably lacking another %%A (as an input filename). Also, why do you assume it should only work in admin mode? Apr 24, 2017 at 10:04
  • So how is this better than using ImageMagick? Jul 4, 2017 at 22:15
  • Sadly, this link seems to have died too. (august 2017)
    – Ideogram
    Aug 16, 2017 at 6:26
  • @Ideogram I have ffound another provider of the download. softsea.com/download/InkscapeBatch.html
    – Avatar
    Aug 16, 2017 at 13:59
  • 1
    FOR %%A IN (*.svg) DO "C:\Users\xxxx\Downloads\inkscape-1.0.2-2-x64\inkscape\bin\inkscape.exe" %%A --export-type=png --export-filename=C:\Users\xxxx\Downloads\AzureIcons\output\%%A.png --export-width 80
    – wenn32
    May 15, 2021 at 14:49
7

For SVG to PNG conversion I found cairosvg (https://cairosvg.org/) performs better than ImageMagick. Steps for install and running on all files in your directory.

pip3 install cairosvg

Open a python shell in the directory which contains your .svg files and run:

import os

for file in os.listdir('.'):
    name = file.split('.svg')[0]
    cairosvg.svg2png(url=name+'.svg',write_to=name+'.png') 

This will also ensure you don't overwrite your original .svg files, but will keep the same name. You can then move all your .png files to another directory with:

$ mv *.png [new directory]
2
  • This answer is the only one that worked for my rather large SVG file, thanks!!! May 17, 2019 at 21:07
  • Works fine as well. Thx. I updated fix to your reply. Dec 8, 2021 at 21:08
5

Most answers given here ignore the at the desired size part of the question. I could not get satisfying results using convert when "upscaling" an SVG. inkscape does a better job and also preserves background transparency.

Depending on your use case, use one of the following options:

  1. export at specified DPI: inscape in.svg -d 300 -e out.png
  2. export at specified width (maintaining aspect ratio): inscape in.svg -w 800 -e output.png
  3. export at specified height (maintaining aspect ratio): inscape in.svg -h 600 -e output.png

Note that specifying both width and height does not preserve the aspect ratio.

To convert many files at once, adjust the following to your use case (in bash or compatible):

for f in *.svg; do
  inkscape "$f" -d 300 -e "${f%.*}.png"
done
3
  • 1
    "$f" and "${f%.*}.png" is better for files with spaces in the file name. Sep 2, 2020 at 14:53
  • Thanks, have updated my answer.
    – kynan
    Sep 4, 2020 at 9:29
  • 1
    Very useful script, thanks for sharing! I've slightly adapted your version. Since I am on wsl, I did not want to open the GUI (hence the -z option), and I only wanted to convert the drawing area and not the whole page, hence the -D option. So I got: inkscape "$f" -z -D -h25 -e "${f%.*}.png" Oct 7, 2022 at 9:26
4

You may use the following in Bash / Ubuntu for Windows, in the folder you have the SVGs at. It seems however that ImageMagick first rasterizes then resizes, which results in strange artifacts…

find -name "*.svg" -exec convert {} -background none -density 300 -resize 256x256 -define icon:auto-resize -alpha remove -colors 256 {}.ico \;

Also see here's Inscape based solution that seems to be working well (from another thread, link lost):

mkdir temp; declare -a res=(16 24 32 48 64 128 256); for f in *.svg; do for r in "${res[@]}"; do inkscape -z -e temp/${f}${r}.png -w $r -h $r $f; done; resm=( "${res[@]/#/temp/$f}" ); resm=( "${resm[@]/%/.png}" ); convert "${resm[@]}" ${f%%.*}.ico; done; rm -rf temp;
1
  • 1
    +1 I used it with inkscape in a very simplified version find -name "*.svg" -exec inkscape {} -e {}.png \; Though I prefer this version: ls | grep ".svg" | xargs -I file inkscape file -e file.png because the files are processed alphabetically — this is not the case, when using find Aug 22, 2018 at 13:13
3

InkscapeBatch does the job on Windows. Requires Inkscape.

3
2

After wrestling with this for almost 2 hours I settled with Inkscape. Since I needed to batch convert a bunch of files in many different resolutions I have created a Powershell script. With 106 SVGs my computer froze for about 5 seconds, so be careful when using this.

# ENTER THE FULL PATH TO THE INKSCAPE EXECUTABLE
$inkscapeExe = "C:\Program Files\Inkscape\inkscape.exe"
# ENTER THE PATH TO THE FOLDER CONTAINING THE SVGs
$svgFolder = "C:\Images\SVG"
# ENTER THE DESIRED WIDTH
$width = 120
# ENTER THE DESIRED HEIGHT
$height = 120

$svgFiles = Get-ChildItem $svgFolder -Filter *.svg
foreach ($svgFile in $svgFiles)
{
    $inputParam  = $svgFile.FullName 
    $outputParam = "--export-png=" + $svgFile.FullName + "-" + $width + "x" + $height + ".png" 
    $widthParam  = "-w" + $width
    $heightParam = "-h" + $height

    & $inkscapeExe $inputParam $outputParam $widthParam $heightParam
}
2
  • Mine froze for more than a few seconds. The & operator starts a new process and continues immediately, so this script will create as many new inkscape.exe processes as you have svg files. Turns out this makes your computer quite slow for a while.
    – Rory
    Nov 26, 2019 at 23:03
  • 1
    If you put | Out-Null at the end of the line that starts with & it'll force it to run the inkscape.exe command one at a time, which works much better for me.
    – Rory
    Nov 26, 2019 at 23:31
0

ImageMagick is available for Windows and can convert between SVG and PNG and ICO (among others). You can set size and other attributes for the output file.

0

I couldn't find a single command that worked to run a batch so I got it to work by generating a file list and creating a series of commands. These instructions should work for all versions of Windows. All typing instructions exclude quotations and include everything between them.

To do this you will need Inkscape, MS Excel or comparable spreadsheet editor and a list generator. There is a great little freeware list generator here: https://www.portablefreeware.com/?id=1171

  • Hardlink, copy or move all the svg files into one folder.
  • Generate a file list of that folder and export to csv.
  • Open the csv in Excel and delete all columns except the file name column. Also delete column headings like [Path] and summary text at the bottom.
  • If the file names aren't already in the second column, cut and paste them there.
  • In the first cell of the first column type inkscape followed by a space and the folder path where your svg files are including a trailing backslash (e.g. "inkscape C:\SVG\"). Then copy this cell, select all cells below it that precede a file name and paste so they all have the same text.
  • In the third column type --export-png= in the first cell followed by the destination folder you'd like to save them in. I just used the same folder. For the syntax to be correct, be sure to add a space at the beginning but keep the rest of the text together (e.g. " --export-png=C:\PNG\"). Copy and paste this for all rows just like the first column
  • Copy the whole second column and paste it to the fourth column. With that fourth column selected Press Ctrl+H (Find & Replace). In the find field type ".svg" In the replace field type ".png", then select Replace all.

If you've done this correctly, you should have one row for each file name that looks like this: |inkscape C:\SVG\|Filename1.svg| --export-png=C:\PNG\|Filename1.png|

  • In the first cell of the fifth column type "=concatenate(a2,b2,c2,d2)". This assumes that the header column hasn't been deleted. The cell numbers in brackets should agree with the current row number. If your first file name is in B2, the above formula is accurate. Otherwise correct, the cell names in brackets to match the first filename's row (e.g. a1,b1,c1...)
  • Copy and paste this cell to fill all below it just like columns 1 and 3.
  • Now copy that whole fifth column and use Paste Special>Values to paste the text produced by the formulas into the sixth column. This sixth column is your money shot. Copy the whole sixth column, Open Notepad and paste that last column into it. If you've done this correctly you will have one command line to convert each of your svg files into pngs.
  • Save the Notepad file to the Inkscape directory as a batch file. When the save as window opens, change Save As type to "All Files" and save it as a .bat file (e.g. "C:\Program Files\Inkscape\SVGBatch.bat"
  • All that is left to do is go into that folder and double-click on the batch file you just saved. It should open a command prompt and convert all files.

Hope that makes someone's life easier. James

0

Kai's answer is close, but didn't work for me. However, with a couple of slight tweaks, this worked flawlessly first time:

  1. Copy your SVGs to a handy location
  2. Create a text file in the same folder and rename it convert.bat
  3. Open convert.bat in your favourite text/code editor and enter the following:

FOR %%A IN (*.svg) DO "C:\Program Files\Inkscape\inkscape.exe" %%A --export-png=%%A.png

(Note that the inkscape.exe location should match the executable program location on your PC; and the second before --export-png is %%A - that's the SVG file being converted)

  1. Double-click convert.bat to run, and it should echo out the results of the conversions.

Note that you may need to refresh your Windows folder to see the new files, but they should all have been created in the same location as the original SVGs.

0

Couldn't get imagemagick or inkscape to work for me for some reason. I only had 12 files to convert just just used this site manually: http://svgtopng.com/ worked a treat.

0

Here is an ImageMagick-based solution to convert all svg files in a given directory to ico files:

mogrify -format ico -density 1200 -background transparent -trim -resize 256x256 -gravity center -extent 256x256 -define icon:auto-resize *.svg

Explanation:

  • mogrify: Like convert, but allows you to batch-process multiple files.
  • -format ico: Our target file format. Creates .ico files instead of overwriting the original file (as mogrify would do by default).
  • -density 1200: Since we can't specify a target pixel size that ImageMagick should rasterize the SVG to (it would first rasterize with a default density and then scale), we rasterize the SVG with an insanely high resolution (1200dpi), to ensure that the image will be downscaled to 256x256 instead of upscaled.
  • -background transparent: Background will be rendered as transparent.
  • -trim: Remove existing border around the image.
  • -resize 256x256: Scale the image, ensuring that the longest side has 256px, keeping the aspect ratio.
  • -gravity center -extent 256x256: Enlarge the canvas, ensuring that the short side has 256px as well. The existing image is center-aligned. This is necessary because we need a square image as the basis for an ICO file.
  • -define icon:auto-resize: Include not only the 256x256 image but also all recommended downscaled resolutions (e.g. 32x32) in the ICO file.

Not the answer you're looking for? Browse other questions tagged .