Screenshots zeigen die englische App. Voreingestellte Namen und Steuerelemente sind auch in Ihrer App-Sprache verfügbar.
Ihr Ausgangspunkt
Verwenden Sie Favicon-Set in PixRinse und vergleichen Sie diese Einstellungen dann mit Ihrem tatsächlichen Ziel.
| Favicon-PNGs | 16 / 32 / 48 px |
|---|---|
| Apple Berühren Sie PNG | 180 px |
| Web-App-PNGs | 192 / 512 px |
| Farbe | sRGB |


Wie es geht
Bereiten Sie eine quadratische Quellenmarkierung vor
Verwenden Sie eine Quelle, die mindestens so groß ist wie das größte benötigte Symbol. Vereinfachen Sie feine Details, die bei 16 px möglicherweise verschwinden.
Wählen Sie Favicon-Set
Sehen Sie sich die sechs Größen an. Die Vorlage verwendet eine zentrierte Abdeckungsregel, sodass eine nicht quadratische Quelle möglicherweise beschnitten wird.
Überprüfen Sie die kleinsten Ausgänge
Überprüfen Sie die Dateien 16 und 32 px in ihrer tatsächlichen Größe. Automatische Größenanpassungen können bewusste optische Anpassungen einer komplexen Markenmarke nicht ersetzen.
Exportieren Sie Bilder und fügen Sie deren Referenzen zu Ihrem Website-Code hinzu
Fügen Sie die PNG-Dateien zu Ihrer Website hinzu und verweisen Sie auf die relevanten Größen im HTML-Head- und Web-App-Manifest.
DIE DATEIEN AUS DIESER KOMPLETTSTRUKTUR
Was dieses Beispiel hervorgebracht hat
Eine 1024 × 1024-Quadratmarkierung erzeugt sechs PNGs ohne die Warnung wegen nicht quadratischer Quelle. Jede exportierte Datei enthält ein sRGB-Profil.
- Quadratische Quelle
- 1024 × 1024
- PNG Exporte
- 6
- Farbprofil
- sRGB bei jeder Ausgabe
| Datei | Format | Pixel | Bytes |
|---|---|---|---|
| android-chrome-192x192.png | PNG | 192 × 192 | 26.980 |
| android-chrome-512x512.png | PNG | 512 × 512 | 174.868 |
| apple-touch-icon.png | PNG | 180 × 180 | 23.839 |
| favicon-16x16.png | PNG | 16 × 16 | 692 |
| favicon-32x32.png | PNG | 32 × 32 | 1.751 |
| favicon-48x48.png | PNG | 48 × 48 | 3.093 |

Gemessen anhand der gezeigten Beispieldateien. Ihre Ergebnisse hängen von Ihren Originalen und Einstellungen ab. In dieser exemplarischen Vorgehensweise werden eigene PixRinse-Kunstwerke auf quadratischen oder transparenten Beispielleinwänden verwendet.
Ein paar häufig gestellte Fragen
Erstellt es favicon.ico?
Nein. Das integrierte Set exportiert sechs PNG-Dateien mit bestimmten Dateinamen.
Funktioniert ein breites Logo?
Eine quadratische Quelle ist vorzuziehen. Die Cover-Regel kann dazu führen, dass eine große Quelle zugeschnitten wird. Sehen Sie sich daher die Vorschau sorgfältig an.
Setzen Sie den Workflow in Gang.
Öffnen Sie PixRinse, fügen Sie ein paar Bilder hinzu und beginnen Sie mit den oben genannten Einstellungen.
Für Mac ladenKostenlos: bis zu 10 Bilder pro Stapel und eine Ausgabe pro Quelle. Für die mehreren Ausgaben dieses Workflows ist Pro erforderlich. Kostenlos und Pro vergleichen.