Favicon-Generator

Alle gängigen Größen fertig in einer ZIP-Datei

Keine Datenbank: AIMRAN speichert weder deine Dateien noch Texte oder Ergebnisse

Was ist Favicon-Generator?

Das Favicon ist das kleine Symbol, das im Tab, in den Lesezeichen und auf dem Startbildschirm des Handys erscheint, wenn jemand deine Website speichert. Jede Website braucht mehrere Größen, und sie von Hand vorzubereiten ist mühsam.

Mit diesem Generator lädst du dein Logo einmal hoch und erhältst alle Dateien fertig in einem ZIP, zusammen mit dem Code, den du in deine Website einfügen musst. Du kannst einen farbigen Hintergrund hinzufügen, die Ecken abrunden oder einen Rand lassen.

So funktioniert es

  1. Zieh dein Logo hinein, am besten quadratisch und mindestens 512 px groß (SVG geht auch).
  2. Stelle den Rand ein und aktiviere bei Bedarf einen farbigen Hintergrund mit abgerundeten Ecken.
  3. Gib den Namen der Website und die Designfarbe für das Manifest ein.
  4. Prüfe die Vorschau und klicke auf „Favicons erstellen“.
  5. Lade das ZIP herunter und füge den HTML-Code in das head-Tag ein.

Vorteile

Technische Details

Erzeugt werden PNGs in 16, 32, 48, 64, 128, 180 (apple-touch-icon.png), 192 und 512 px (android-chrome-192x192.png und android-chrome-512x512.png). Die favicon.ico ist ein ICO-Container mit eingebetteten 32-Bit-PNGs in 16, 32 und 48 px, ein Format, das alle aktuellen Browser sowie Windows Vista und neuer unterstützen. Das site.webmanifest enthält name, short_name (12 Zeichen), die Icons mit 192 und 512 px, theme_color, background_color und display standalone. Das Icon wird im Modus „contain“ in eine quadratische Fläche eingepasst, mit einem Rand von 0 % bis 30 % und einem Eckenradius von 0 % bis 50 % (Kreis). Akzeptiert JPG, PNG, WEBP, AVIF, BMP, GIF, HEIC und SVG bis 20 MB.

Häufige Fragen

Welche Größe sollte ein Favicon haben?

Grundlegend sind eine favicon.ico mit 16, 32 und 48 px, ein PNG mit 180 px für das iPhone und PNGs mit 192 und 512 px für Android. Dieser Generator erstellt sie alle.

Wie binde ich das Favicon in meine Website ein?

Lade die Dateien aus dem ZIP in das Stammverzeichnis deiner Website hoch und füge den HTML-Code, den wir dir geben, in das head-Tag deiner Seiten ein.

Kann ich ein Favicon aus einer SVG erstellen?

Ja. Die SVG wird scharf in jede Größe umgewandelt, was bei den großen Icons sehr gute Ergebnisse liefert.

Was ist das apple-touch-icon?

Das Icon mit 180 × 180 px, das iPhone oder iPad verwenden, wenn jemand deine Website zum Startbildschirm hinzufügt.

Weitere Tools: Bild