Comment convertir un SVG carré en ICO toutes tailles?

24

J'ai dessiné une icône dans InkScape et je voudrais l'exporter dans un fichier ICO qui inclurait des sprites pour toutes les résolutions raisonnables (16x16, 32x32, ... 256x256 etc.). Comment cela peut-il être fait (sans utiliser de logiciels énormes et coûteux comme Photoshop, CorelDraw, etc.)?

Ivan
la source
2
Une recherche rapide me dit qu'il n'y a aucun moyen d'exporter même un seul ICO hors d'InkScape, mais il y a beaucoup de suggestions sur la façon de le faire avec des logiciels supplémentaires gratuits tels que GIMP. Avez-vous vérifié ces options? S'ils ne travaillaient pas pour vous, pouvez-vous dire pourquoi?
usr2564301
@RadLexus, ce que j'ai essayé, c'est un certain nombre d'outils en ligne et tous, pour autant que je puisse comprendre, signifient créer des ICOn à taille unique.
Ivan
5
Vous voulez donc savoir comment créer des ICO de tailles multiples? Essayez les options de cette réponse Stack Overflow: stackoverflow.com/questions/4354617/… (encore une fois, trouvée par une simple requête Google ...).
usr2564301
1
Il existe une extension Inkscape qui semble s'exporter en tant que fichier ico , mais je n'ai pas le temps pour le moment d'essayer si cela fonctionne.
Paolo Gibellini
Si vous avez trouvé l'une des réponses ci-dessous pour répondre à votre question, veuillez la marquer comme réponse acceptée.
DᴀʀᴛʜVᴀᴅᴇʀ

Réponses:

24

Vous pouvez utiliser ImageMagick immédiatement:

convert -density 384 icon.svg -define icon:auto-resize icon.ico
heltonbiker
la source
3
Pourquoi cette densité?
naught101
1
Je ne sais pas, je viens de copier-coller ça d'ailleurs.
heltonbiker
@ naught101 voici la documentation de l'indicateur de densité - bien qu'il semble que ce soit une étape plutôt inutile à moins que vous ne fassiez quelque chose de très spécifique avec les tailles d'image, les dpi et la pixellisation d'image intermédiaire de ceux-ci. imagemagick.org/script/command-line-options.php#density
CreationTribe
7
Utilisez convert -background none icon.svg -define icon:auto-resize icon.icopour conserver un arrière-plan transparent.
Robert Hume
2
magick convert -background none icon.svg -define icon:auto-resize icon.icotravaillé pour moi.
intotecho
15

Une solution en ligne de commande:

1) Exportez votre SVG en PNG avec InkScape

2) Redimensionnez cette image PNG aux tailles que vous souhaitez avec ImageMagick:

magick convert master.png -resize 16x16 16.png
magick convert master.png -resize 32x32 32.png
magick convert master.png -resize 48x48 48.png

3) Convertissez les images PNG en ICO:

magick convert 16.png 32.png 48.png icon.ico

4) Assurez-vous que votre ICO contient tout:

identify icon.ico
icon.ico[1] ICO 16x16 16x16+0+0 32-bit sRGB 21.2KB 0.000u 0:00.000
icon.ico[0] ICO 32x32 32x32+0+0 32-bit sRGB 21.2KB 0.000u 0:00.000
icon.ico[0] ICO 48x48 48x48+0+0 32-bit sRGB 21.2KB 0.000u 0:00.000
philippe_b
la source
Vous pouvez également utiliser un simple fichier batch ou shell afin de simplifier le travail.
Paolo Gibellini
3
Ne serait-il pas préférable (même si c'est un peu plus compliqué) d'exporter les nombreuses tailles png directement depuis SVG au lieu de redimensionner des PNG déjà tramés?
heltonbiker
1
Juste au cas où quelqu'un d'autre serait curieux, le "..." n'est pas littéral. Il représente d'autres tailles de fichier png à entasser dans le fichier favicon.ico.
Nostalg.io
@ Nostalg.io Bonne remarque, merci! J'ai édité la réponse.
philippe_b
5

Version bash ...

#!/bin/bash

set -ex

svg=$1

size=(16 32 24 48 72 96 144 152 192 196)

echo Making bitmaps from your svg...

for i in ${size[@]}; do
  inkscape $svg --export-png="favicon-$i.png" -w$i -h$i --without-gui
done

echo Compressing...

## Replace with your favorite (e.g. pngquant)
# optipng -o7 favicon-*.png
pngquant -f --ext .png favicon-*.png --posterize 4 --speed 1

echo Converting to favicon.ico...

convert $(ls -v favicon-*.png) favicon.ico

## Clean-up maybe?
# rm favicon-*.png

echo Done

Usage: ./favicon.sh your-square-svg-file.svg

Requiert: inkscape imagemagick optipng (facultatif) de votre gestionnaire de paquets.

J'ai trouvé plus facile de recréer cela pour le shell bash car Win10 et Inkscape ne s'entendaient pas. Cela a été testé dans le sous-système Windows pour Linux, mais cela devrait également fonctionner sur Mac.

J'ai utilisé cette référence pour choisir les tailles auxquelles je tenais: https://github.com/audreyr/favicon-cheat-sheet . Ajustez la sizebaie à vos besoins spécifiques.

Gary
la source
4

Je suggérerais cette approche:

1) créez un script pour exporter le SVG à n'importe quelle taille requise. J'ai codé ce script .bat pour m'aider à créer une icône Android

@echo off
set file="%~f1"
set path=%~dp1
set inkscape="C:\Program Files\Inkscape\inkscape.exe"

echo Le icone saranno salvate in %path%
echo Produzione icone applicative

echo %file% --export-png="%path%/ic32.png" -w32 -h32 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic48.png" -w48 -h48 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic72.png" -w72 -h72 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic96.png" -w96 -h96 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic144.png" -w144 -h144 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic192.png" -w192 -h192 > %~dp1/commands.txt
echo %file% --export-png="%path%/ic512.png" -w512 -h512 > %~dp1/commands.txt
%inkscape% --shell < %~dp1/commands.txt
erase "%~dp1/commands.txt"

echo Procedura terminata

REMARQUE :

  • le % var défini inkscape% doit être adapté à votre chemin d'installation d'Inkscape
  • le script fait écho à toutes les commandes d'exportation vers un fichier temporaire pour une meilleure gestion du processus inkscape. Le paramètre cli "shell" accepte plus de commandes utilisant une seule instance au lieu de générer une instance par commande.

Avec ce paramètre, Inkscape entrera dans un mode shell de ligne de commande interactive. Dans ce mode, vous tapez des commandes à l'invite et Inkscape les exécute, sans que vous ayez à exécuter une nouvelle copie d'Inkscape pour chaque commande. Cette fonctionnalité est principalement utile pour les scripts et les utilisations de serveur: elle n'ajoute aucune nouvelle fonctionnalité mais vous permet d'améliorer la vitesse et les besoins en mémoire de tout script qui appelle à plusieurs reprises Inkscape pour effectuer des tâches de ligne de commande (telles que l'exportation ou les conversions). Chaque commande en mode shell doit être une ligne de commande Inkscape valide complète mais sans le nom du programme Inkscape, par exemple "file.svg --export-pdf = file.pdf". ( voir le manuel d'inkscape )

2) Ajoutez au script ci-dessus la syntaxe de conversion indiquée dans la réponse philippe-b qui fusionne tous les PNG générés en un seul fichier ICO

3) En option, supprimez tous les fichiers PNG exportés car ils ne sont plus nécessaires

Mattia Galati
la source
1

Ce site Web est ma référence pour la génération de favicon car il comprend les icônes de l'écran d'accueil pour la plupart des appareils (Windows, macOS, Android, iOS) https://realfavicongenerator.net/

Brandito
la source