Arbeitsablauf und Softwareauswahl beim Konvertieren komplexer Bilder in Favicon?

Ich würde versuchen, Ihr komplexes Design als Vektor in Illustrator zu entwickeln:

Erstellen Sie die Zeile mit Line Segment Tool:

Gehe zu Object -> Expand:

Überprüfen Sie die Optionen im Bedienfeld:

Nach OK sollten Sie in der Lage sein, die Füllung anzupassen oder sogar eine Kontur anzuwenden:

Beim Erweitern der Linien werden sie in der Größe angepasst, wenn Sie die Zeichenfläche in Illustrator anpassen.

Sie könnten das verwenden, um eine Variation der Größe zu skripten, die in diesem Artikel enthalten war, den ich einmal von CSS-Tricks mit dem Titel Favicons, Touch-Icons, Tile-Icons usw. gelesen habe. Was brauchen Sie? .

Dieser Artikel führte zu einem Generator, der alles erzeugen konnte, was für eine Webseite namens RealFaviconGenerator benötigt wurde .

Nachdem ich diesen Artikel gelesen hatte, entschied ich mich, einfach ein PNG zu erstellen, aber da Ihre Frage lautet, wie man ein Favicon erstellt, dachte ich, ich würde auch eine Imagemagick-Lösung bereitstellen, die hier zu finden ist :

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

Eine Problemumgehung, die es ermöglicht, ein Bild mit niedriger Auflösung auf einem Bild mit hoher Auflösung in Gimp oder Photoshop nachzuzeichnen, sieht folgendermaßen aus (Beispiel in Gimp):

• Öffnen Sie das gewünschte Originalbild.
• Ändern Sie die Größe der Leinwand auf ein Quadrat mit der gleichen Breite und Höhe wie die größte Abmessung des Bildes. Wenn das Originalbild z. B. 800×600 groß ist, stellen Sie die Leinwand auf 800×800 ein.
• Erstellen Sie eine neue transparente Ebene über dem Originalbild.
• Verwenden Sie in der neuen transparenten Ebene Filter-Render-Patterns-Grid und erstellen Sie ein Raster, sodass das Bild in 32 Zeilen und 32 Spalten unterteilt wird. Wählen Sie eine Farbe für das Raster, die Sie nicht im Bild verwenden werden.
• Verringern Sie die Deckkraft des darunter liegenden Originalbildes etwas, es sieht so aus:

• Jedes Quadrat im Raster wird zu einem Pixel im endgültigen Bild, also füllen Sie jetzt die entsprechenden aus, bis Sie ungefähr so ​​​​aussehen:

• Der letzte Schritt besteht darin, dieses Bild auf 32 × 32 zu skalieren und als Symbol zu speichern!