Favicon-Generator – Erstelle alle Favicon-Größen aus dem Bild

Laden Sie jedes Bild hoch und erhalten Sie sofort das komplette Favicon-Set: 16, 32, 48, 180 (Apple), 192 & 512 (PWA) plus site.webmanifest, verpackt als ZIP.

Fügen Sie Ihr Logo ein, um jede Favicon-Größe zu generieren

Enthält site.webmanifest + HTML-Ausschnitt

Über Favicon Generator

Rendert dein Bild in die sechs Favicons-Größen, die Browser heute tatsächlich verwenden (wobei der Legacy-.ico-Pfad übersprungen wird, den nur wenige Seiten noch benötigen), plus ein bereites Webapp-Manifest. Läuft komplett in deinem Browser – kein Upload, kein Warten.

Frequently Asked Questions

Für moderne Browser und Geräte benötigen Sie sechs Größen: 16×16 und 32×32 für Browser-Tabs, 48×48 für Windows-Seitensymbole, 180×180 für Apple Touch Icon (iOS-Startbildschirm) und 192×192 + 512×512 für Android-Startbildschirme und PWA-Installationsaufforderungen. Unser Generator erstellt alle sechs plus ein site.webmanifest aus einem einzigen Quellbild.

usage

Die meisten modernen Browser bevorzugen die PNG-Link-Tags (rel="Icon", Typ="Bild/png"), sodass keine ICO-Datei mehr erforderlich ist. Wir überspringen das Legacy-ICO und stellen PNG-Favicons passend für jedes moderne Ziel passend dimensioniert. Wenn du Internet Explorer oder sehr altes Chrome unterstützen musst, kannst du eines der PNGs separat in ICO umwandeln.

technical

Ein Web-App-Manifest ist eine JSON-Datei, die Android, Chrome und Edge anzeigt, wie Ihre Seite aussehen soll, wenn sie als progressive Web-App installiert ist – Symbol, Name, Theme-Farbe und Anzeigemodus. Unser Generator enthält ein Starter-Manifest, das auf die Android-Chrome-Symbole zeigt; Du musst nur den Namen und theme_color bearbeiten.

features

Ein quadratisches (1:1) PNG bei 512×512 oder größer liefert bei jeder Größe das sauberste Ergebnis. Vermeiden Sie feine Details, die bei 16×16 verschwinden – Favicons funktionieren am besten mit einer einzigen, kräftigen Form und hohem Kontrast. Transparente PNGs funktionieren; Das Tool schreibt sie in Letterboxen, sodass das Symbol in jeder Größe zentriert ist.

tips

Ja – dein Quellbild wird über die Canvas-API verkleinert und lokal als ZIP verpackt. Es wird nichts hochgeladen. Dies macht es sicher, Icons für unveröffentlichte Produkte und Markenidentitäten vor dem Start zu erstellen.

privacy

Entpacken Sie den Download in den /public- (oder Webroot-)Ordner Ihrer Website und fügen Sie dann den beigefügten HTML-Ausschnitt zu Ihrem <Head> ein: Link-Tags für die PNG-Symbole plus einen Link zu site.webmanifest. Aktualisieren Sie Ihre Seite stark (Cmd+Shift+R) – Browser cachen Favicons aggressiv, daher müssen Sie möglicherweise den Cache leeren, damit das neue Symbol erscheint.

usage

Ja – die 192×192 und 512×512 PNGs sind genau das, wonach Chrome und Edge suchen, um eine Seite als installierbare PWA zu qualifizieren. Zusammen mit dem Manifest erfüllen sie die PWA-Installationsprüfung des Leuchtturms.

technical

Ja. Keine Wasserzeichen, keine Anmeldung, keine Nutzungsgrenze – und der Postlauf gehört für immer dir. Wir haben dieses Tool hinzugefügt, weil jeder Entwickler irgendwann ein Favicon-Set benötigt und die bestehenden Generatoren entweder mit Werbung gefüllt waren oder man für hochauflösende Ausgaben bezahlen musste.

pricing

Use Cases

Indie-Hacker startet

Solo-Gründer, die ihren MVP veröffentlichen, brauchen vor dem Start ein ausgefeiltes Favicon. Generiere jede Größe aus deinem einzelnen Logobild und dem Manifest mit einem Klick – kein Figma, kein Design-Abonnement nötig.

development

Agenturkundenaufbau

Beim Bereitstellen einer neuen Kundenseite ist das Favicon-Set selten budgetiert, aber immer erwartet. Generiere die ZIP am Ende des Projekts, setze sie in /public und hake die Lieferung an.

agency

PWA-Installierbarkeit

Um die Chrome-Installierbarkeitsprüfung zu bestehen, benötigt Ihr Manifest 192×192 und 512×512 Symbole. Unsere Ausgabe erfüllt diese Anforderung von Anfang an, plus die passenden HTML-Head-Tags.

development

Multi-Brand-Arbeitsbereiche

Agenturen und Berater, die mehrere Kundenmarken jonglieren, können das Feavicon-Set in 10 Sekunden neu generieren, sobald ein Marken-Update ausgeliefert wird – es ist keine Photoshop-Aktion nötig.

agency

Open-Source-Projektbranding

GitHub Pages, Vercel, Netlify und Cloudflare Pages-Seiten benötigen alle Favicons, um in den Browser-Tabs ausgefeilt auszusehen. Füge die generierten Dateien in dein Repository ein, und dein Projekt sieht ausgeliefert aus.

opensource

Rebranding Refresh

Wenn sich Ihr Logo ändert, generieren Sie jede erforderliche Größe neu – einschließlich des 180px Apple Touch-Symbols und des 512px Android PWA-Symbols –, ohne manuell aus Illustrator neu zu exportieren.

branding