Wie wandelt man ein quadratisches SVG in ein ICO aller Größe um?

Eine Kommandozeilenlösung:

1. Exportieren Sie Ihr SVG master.svgmit Inkscape in PNG:

# Install on Ubuntu
sudo apt-get install inkscape
# Other systems: make sure Inkscape is in your PATH

inkscape -w 16 -h 16 -e 16.png master.svg
inkscape -w 32 -h 32 -e 32.png master.svg
inkscape -w 48 -h 48 -e 48.png master.svg

2. Konvertieren Sie die PNG-Bilder mit ImageMagick in ICO:

# Install on Ubuntu
sudo apt-get install imagemagick

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

3. Optional - Stellen Sie sicher, dass Ihr ICO alles enthält:

$ 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

Sie können ImageMagick sofort verwenden :

convert -density 384 icon.svg -define icon:auto-resize icon.ico

[Bearbeiten]

magickSeit ImageMagick Version 7 müssen Sie vor dem Befehl hinzufügen (siehe Dokument zur CLI ), daher lautet die Befehlszeile jetzt:

magick -density 384 icon.svg -define icon:auto-resize icon.ico

Weitere Informationen finden Sie auch in dieser Antwort: https://stackoverflow.com/a/16922387/1603480

Bash-Version ...

#!/bin/bash

set -ex

svg=$1

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

out="$(mkdir -d)"

echo Making bitmaps from your svg...

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

echo Compressing...

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

echo Converting to favicon.ico...

convert "$out/*.png" favicon.ico

# Clean-up
rm -rf "$out/"

echo Done

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

Benötigt: inkscape imagemagick optipng (optional) von Ihrem Paketmanager.

Ich fand es einfacher, dies für die Bash-Shell neu zu erstellen, da Win10 und Inkscape nicht miteinander auskamen. Dies wurde im Windows-Subsystem für Linux getestet, sollte aber auch auf Mac funktionieren.

Verwenden Sie diese Referenz, um die Größen auszuwählen, die mir wichtig sind: https://github.com/audreyr/favicon-cheat-sheet . Passen Sie das sizeArray an Ihre spezifischen Bedürfnisse an.

Ich würde diese Vorgehensweise vorschlagen:

1) Erstellen Sie ein Skript, um die SVG-Datei in jede gewünschte Größe zu exportieren. Ich habe dieses .bat-Skript codiert, um mir beim Erstellen eines Android-Symbols zu helfen

@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

HINWEIS :

• die definierte %inkscape% -Variable sollte Ihrem Inkscape-Installationspfad entsprechen
• Das Skript gibt alle Exportbefehle in eine temporäre Datei zurück, um den Inkscape-Prozess besser zu verwalten. Der CLI-Parameter „shell“ akzeptiert mehr Befehle mit einer einzigen Instanz, anstatt eine Instanz pro Befehl zu erzeugen.

Mit diesem Parameter wechselt Inkscape in einen interaktiven Befehlszeilen-Shell-Modus. In diesem Modus geben Sie Befehle an der Eingabeaufforderung ein und Inkscape führt sie aus, ohne dass Sie für jeden Befehl eine neue Kopie von Inkscape ausführen müssen. Diese Funktion ist vor allem für Skripterstellung und Serveranwendungen nützlich: Sie fügt keine neuen Funktionen hinzu, ermöglicht Ihnen jedoch, die Geschwindigkeit und den Speicherbedarf jedes Skripts zu verbessern, das Inkscape wiederholt aufruft, um Befehlszeilenaufgaben (z. B. Export oder Konvertierungen) auszuführen. Jeder Befehl im Shell-Modus muss eine vollständige gültige Inkscape-Befehlszeile sein, jedoch ohne den Namen des Inkscape-Programms, zum Beispiel "file.svg --export-pdf=file.pdf". ( siehe Inkscape-Handbuch )

2) Fügen Sie dem obigen Skript die Konvertierungssyntax hinzu, die in der philippe-b-Antwort angegeben ist und alle generierten PNGs zu einer einzigen ICO-Datei zusammenführt

3) Entfernen Sie optional alle exportierten PNGs, da sie nicht mehr benötigt werden

Diese Website ist meine Anlaufstelle für die Generierung von Favicons, da sie die Symbole für den Bildschirm „Zum Startbildschirm hinzufügen“ für die meisten Geräte (Windows, macOS, Android, iOS) enthält https://realfavicongenerator.net/

Um SVG in eine ICO-Datei zu konvertieren, können Sie Folgendes verwenden: https://redketchup.io/icon-editor und die Option: „Create Icon from Image“.

Erforderliche Werkzeuge: Inkscape und Gimp

1. inkscape: exportiere dein svg in ein png 64x64.
2. gimp: Erstellen Sie ein neues Projekt mit einem transparenten Hintergrund und einer Ebenengröße von 64 x 64 und importieren Sie das PNG-Bild in die Ebene.
3. Duplizieren Sie die Ebene, gehen Sie zu "Ebene"> "Ebene skalieren"> wählen Sie 32x32
4. Duplizieren Sie die letzte Ebene erneut und wiederholen Sie die Skalierung für 16x16, 8x8
5. Exportieren Sie das Bild in .ico und Sie sehen alle Ebenen, die in die einzelne .ico-Datei eingebettet werden. (Stellen Sie sicher, dass Sie keine leeren Ebenen haben)

Während die meisten Online-Tools diese Aufgabe nicht bestanden haben (und in eine .ico-Datei mit einer einzigen Auflösung konvertiert wurden), bin ich gerade auf eines gestoßen, das gut funktioniert hat: https://anyconv.com/svg-to-ico-converter/

Es konvertierte meine .svg-Datei in eine .ico-Datei mit 9 verschiedenen Auflösungen, von 16x16 bis 256x256.

Hier ist die Lösung von @pillippe_bWrapping in eine BASH-Funktion:

function svg2ico {
  basename=${1%.svg}
  inkscape -w 16 -h 16 -e "$basename_16.png" "$1"
  inkscape -w 32 -h 32 -e "$basename_32.png" "$1"
  inkscape -w 48 -h 48 -e "$basename_48.png" "$1"
  convert -verbose "$basename_16.png" "$basename_32.png" "$basename_48.png" "$basename.ico"
}

Nur die resultierende .icoDatei bleibt. Dazu müssen Inkscape und ImageMagick installiert sein:

sudo apt-get install inkscape imagemagick

Inkscape ist nett, aber ich habe es bereits unter Windows und es würde viel zusätzlichen Platz in meiner WSL- Umgebung verschlingen. Dank des vorherigen Tipps , den ich positiv bewertet habe, habe ich Imagemagick convert direkt verwendet , um die Größe auf verschiedene Auflösungen zu ändern, z. B. source.svgüber die Befehlszeile:

convert -resize 16x16 -background none source.svg 16.ico
convert -resize 32x32 -background none source.svg 32.ico

Was auch einfach genug ist, um ein Skript zu erstellen. Beachten Sie, dass dies nur eine Lösung beinhaltet. Gemäß der akzeptierten Antwort können Sie für mehrere Auflösungen zuerst convertmehrere PNG- Dateien erstellen und dann alle kombinieren, z convert 16.png 32.png 48.png 64.png 128.png favicon.ico.

Es ist notwendig, -background none zu verwenden , da der Standardwert weiß ist, "wenn keiner angegeben oder im Bild gefunden wird". Entfernen Sie es natürlich, wenn Sie tatsächlich einen Hintergrund behalten möchten.

Es ist ziemlich cool, convertDinge wie die präzise Größenänderung eines JPG-Bildes während der Konvertierung in PNG mit einem ähnlichen Befehl wie oben zu tun.

Zum Beispiel:

convert -resize 700 path/to/original.jpg path/to/resized.jpg

Ändert die Größe von original.jpg auf eine Breite von 700 Pixel unter Beibehaltung des Seitenverhältnisses in eine neue Datei resized.jpg . Eines der intuitivsten Befehlszeilen-Tools, die ich je verwendet habe!