Favicon-Generator

Ein komplettes Favicon-Set — ICO, PNG-Größen, Apple-Touch-Icon, Web-Manifest — aus einem Bild erstellen, direkt im Browser.

Über Favicon-Generator

Was es ist

Dieses Tool macht aus einem Bild alle Icons, die eine Website braucht: favicon.ico, PNGs von 16 bis 512 Pixel, das Apple-Touch-Icon und ein Web-App-Manifest, dazu das HTML für den <head>. Vorschauen zeigen, wie das Icon in einem Browser-Tab und auf den Startbildschirmen von iOS und Android aussieht. Aus einem SVG entsteht zusätzlich ein sauberes Vektor-icon.svg.

Hauptfunktionen

  • favicon.ico, PNGs in 16, 32, 180, 192 und 512 px und site.webmanifest in einem ZIP.
  • Ein Vektor-icon.svg, wenn die Quelle ein SVG ist.
  • Vorschauen für Browser-Tab, iOS-Startbildschirm und Android.
  • Innenabstand, transparenter oder farbiger Hintergrund, App-Name, Kurzname und Theme-Farbe.
  • Das HTML-Snippet für den <head>.

So funktioniert es

  1. Zieh ein Bild auf die Fläche, klick sie an, um eines zu wählen, oder klick auf „Beispiel“.
  2. Leg Innenabstand und Hintergrund fest, auf Wunsch auch App-Name und Theme-Farbe.
  3. Prüfe die Vorschauen.
  4. Lade das ZIP herunter und kopiere das HTML-Snippet in den <head> deiner Seite.

Wann es hilft

  • Einer neuen Website oder Web-App in wenigen Minuten Icons geben.
  • Ein unscharfes oder fehlendes Favicon ersetzen.
  • Ein Startbildschirm-Icon für eine Progressive Web App erstellen.

Datenschutz und Grenzen

Deine Daten

Dein Bild wird im Browser verarbeitet und nicht auf einen Server hochgeladen — die Website erhält nur ein anonymes Ereignis „Tool geöffnet“, ohne Inhalt. Ein Ergebnis, das du an ein anderes Tool schickst, bleibt 24 Stunden auf diesem Gerät unter „Letzte Aktivität“.

Grenzen

  • Eine Rasterquelle unter 512 px wirkt in den größten Größen weich; das Tool weist darauf hin.
  • Ein nicht quadratisches Bild wird zentriert ins Quadrat eingepasst, nicht gestreckt.

Häufige Fragen

Welche Dateien bekomme ich?

favicon.ico für alte Browser, die PNGs favicon-16x16 und favicon-32x32 für Tabs, apple-touch-icon.png für iOS, PNGs in 192 und 512 px für Android und das Manifest, site.webmanifest und bei einer SVG-Quelle icon.svg.

Welches Ausgangsbild eignet sich am besten?

Ein quadratisches SVG oder ein PNG mit mindestens 512 × 512 px und einer einfachen Form. Feine Details verschwinden bei 16 px — ein kräftiges Zeichen liest sich besser als ein ganzes Logo mit Text.

Wie füge ich die Icons zu meiner Website hinzu?

Entpack das ZIP ins Stammverzeichnis deiner Website und füge das HTML-Snippet in den <head> deiner Seiten ein.