So geht’s
JPEG, PNG, WebP oder GIF wählen. Datei erstellen baut das Paket. Herunterladen speichert ein ZIP. Dateien auf die Website legen und die Link-Tags aus README.txt in das head-Element kopieren.
Beispiel
README.txt enthält Link-Tags für das Icon, das 32-Pixel-PNG und das Apple-Touch-Icon.
Eingabe
Ein quadratisches Logo-PNGAusgabe
favicon-pack.zip mit favicon.ico, PNGs bei 16, 32, 48 und 180 Pixeln und README.txtSo funktioniert es
Jede Größe wird auf ein weißes Quadrat gezeichnet, damit ein transparentes Logo auf heller und dunkler Browser-Chrome sichtbar bleibt. favicon.ico enthält die 16- und 32-Pixel-PNGs in einem PNG-in-ICO-Container. Das 48-Pixel-PNG ist ein allgemeines Shortcut-Icon. Das 180-Pixel-PNG ist die Apple-Touch-Größe. Das ZIP wird gespeichert, nicht neu komprimiert, und enthält das HTML-Snippet.
Häufige Fehler
- Das Icon wirkt beschnitten Die Quelle wird auf ein Quadrat gestreckt. Beginnen Sie mit einem quadratischen Bild, wenn die Grafik nicht gestreckt werden darf.
- Ein alter Browser ignoriert favicon.ico Das ICO verwendet eingebettete PNGs, die aktuelle Browser lesen. Die separaten PNG-Dateien sind der Fallback in der README.
- Das ZIP erschien nicht Datei erstellen muss vor Download gelingen. Ein beschädigtes Bild scheitert, bevor das Paket gebaut wird.
Einschränkungen
Das Paket enthält kein Web-App-Manifest, SVG-Favicon oder 512-Pixel-Maskable-Icon. Animation wird auf ein Frame reduziert. Dateien über 15 MB oder 8000 Pixel auf einer Seite werden abgelehnt. Das Bild wird nicht hochgeladen.
Datenschutz
Die Datei bleibt in Ihrem Browser. PepsTools lädt sie nicht hoch, speichert sie nicht und sendet sie nicht an einen anderen Dienst. Leeren Sie das Werkzeug oder verlassen Sie die Seite, um sie aus dem Speicher zu entfernen.
Fragen
Welche Tags sollte die Site verwenden?
Die README im ZIP listet einen favicon.ico-Link, einen 32-Pixel-PNG-Link und einen apple-touch-icon-Link. Kopieren Sie diese in das head-Element und passen Sie die Pfade an den Ablageort der Dateien an.