26
votes

I would like to create .ico icon for my Windows application dynamically (from the SVG file) by using ImageMagick. How do I do that?

Microsoft lists various color depth and size requirements for the icon. ImageMagick has the -depth and -colors options, but I'm not sure how to use them correctly in this case.

Additionaly, it looks like Vista+ supports 256x256 hi-res icon embedded into the very same .ico which can (should? must?) be a compressed PNG. How do I "join" the Windows XP icons and this new Vista icon into a single .ico file?

9
In case you're wondering, this is the application icon (the one sticked on the .exe itself).Linas
ImageMagick doesn't support 256x256 icons and will break those filesphuclv

9 Answers

30
votes

ImageMagick has a recipe for this in their documentation, see FavIcon Web Page Link Thumbnail

Essentially you run the following:

convert image.png  -bordercolor white -border 0 \
          \( -clone 0 -resize 16x16 \) \
          \( -clone 0 -resize 32x32 \) \
          \( -clone 0 -resize 48x48 \) \
          \( -clone 0 -resize 64x64 \) \
          -delete 0 -alpha off -colors 256 favicon.ico

You can modify this to include larger resolutions as necessary and to change things like border, transparency settings etc.

8
votes

It doesn't seem like ImageMagick alone can do this as it does not handle SVG resizing in a sane way (but instead resizes the SVG only after rasterizing which produces a horrid result)

By using inkscape to do the conversion it appears to be possible though, e.g. The following one liner should give you a usable icon with all icon sizes:

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;

The above will not however give you 8 and 4 bit icons within the file (I think these are only needed for older windows versions that are no longer supported) It should be possible with a bit more work to have it do these if you need them.

8
votes
magick convert in.jpg -define icon:auto-resize=16,48,256 -compress zip out.ico

http://imagemagick.org/script/command-line-options.php#define

7
votes

I cleaned up Malcolm's solution, fixed a bug, and also made the script output tiffs so you can run tiff2icns in osx.

#! /bin/bash
# converts the passed-in svgs to tiff and ico

if [[ $# -eq 0 ]]; then
    echo "Usage: $0 svg1 [svg2 [...]]"
    exit 0
fi

temp=$(mktemp -d)
declare -a res=(16 24 32 48 64 128 256 512)
for f in $*; do
    mkdir -p $temp/$(dirname $f)
    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}" )
    for filetype in ico tiff; do
        convert "${resm[@]}" ${f%%.*}.$filetype
    done
done
rm -rf $temp
4
votes

Here's the standard recipe from the FAQ, modified to have all the resolutions mentioned in the msdn link (except those under "Additional sizes...") (the other answer didn't have all resolutions desired)

 convert input.png -bordercolor white -border 0 ( -clone 0 -resize 16x16 ) ( -clone 0 -resize 24x24 ) ( -clone 0 -resize 32x32 ) ( -clone 0 -resize 40x40 ) ( -clone 0 -resize 48x48 ) ( -clone 0 -resize 64x64 ) ( -clone 0 -resize 256x256 ) -delete 0 -alpha off -colors 256 output.ico
2
votes

Bash one-liner to convert logo.svg into logo.ico, using Inkscape to export the png images at various sizes:

eval convert \
  '<(inkscape -e /dev/stderr logo.svg -w '{16,24,32,48,64,128,256}' 2>&1 > /dev/null)' \
  logo.ico

Inspired by Malcolm MacLeod's answer, but avoiding the explicit loop and the temporary files.

The stderr and redirection is to avoid Inkscape's success message on stdout (“Bitmap saved as: /dev/stdout”) ending up in the image data.

2
votes

Building on all previous answers and correcting the following mistakes:

  • Don't use -color=256, as you need 32-bit color versions for all sizes with modern Windows versions (Vista+)
  • Necessary sizes in Windows are 16, 24, 32, 48, 64, 128, 256. Most scripts forgot those. I am unsure if 96 is really needed, but it doesn't hurt.
  • You need to include 4-bit and 8-bit palette versions for the sizes 16, 24, 32 and 48 (apparently to support Remote Desktop applications in particular)

All in one bash script (starting from logo.svg and producing logo.ico):

#!/bin/bash

for size in 16 24 32 48 64 96 128 256; do
    inkscape -z -e $size.png -w $size -h $size logo.svg >/dev/null 2>/dev/null
done

for size in 16 24 32 48; do

  convert -colors 256 +dither $size.png png8:$size-8.png
  convert -colors 16  +dither $size-8.png $size-4.png

done

convert 16.png 24.png 32.png 48.png 16-8.png 24-8.png 32-8.png 48-8.png 16-4.png 24-4.png 32-4.png 48-4.png 64.png 96.png 128.png 256.png logo.ico

rm 16.png 24.png 32.png 48.png 16-8.png 24-8.png 32-8.png 48-8.png 16-4.png 24-4.png 32-4.png 48-4.png 64.png 96.png 128.png 256.png 
1
votes

Modifying hnasarat's answer for windows users. The easiest way to is install InkScape and ImageMagick using Chocolatey and then run the following in a batch file. (It is not as flexible as the other answers you just pass in one svg but it pumps out all the favicons recommended in Favicon Cheat Sheet.

@ECHO off

IF "%1"=="" (
    ECHO You must provide an svg file
    EXIT /b
) 

IF NOT EXIST favicons MD favicons

SET "sizes=16 24 32 48 57 64 72 96 120 128 144 152 195 228 256 512"

FOR %%s IN (%sizes%) DO (
    inkscape -z -e favicons/favicon-%%s.png -w %%s -h %%s %1
)

convert favicons/favicon-16.png favicons/favicon-24.png favicons/favicon-32.png favicons/favicon-48.png favicons/favicon-64.png favicons/favicon.ico
0
votes

To create an ICO file from a SVG while keeping aspect ratio:

  1. look for SVG proportions (eg. 1920x1080)
  2. for a max 256px wide icon, do the proportion: [1920:1080=256:x] -> x=(1080*256)/1920=144
  3. finally, use ImageMagick convert command:

    convert -background none -resize 256x144 -gravity center -extent 256x144 image.svg image.ico