Favicon Tool - Anleitung

Das Favicon Tool macht aus einem Bild, auch einem KI-generierten, alle Favicon-Dateien, die deine Website braucht.

Wege zur Generierung

Es gibt zwei Wege:

1. Upload-Flow: Eigenes Bild hochladen und Favicons generieren
2. KI-Flow: Bild per Prompt oder URL erzeugen und daraus Favicons erstellen

Voraussetzungen

Nimm am besten ein quadratisches Bild mit klar erkennbarem Motiv. Ab 512×512 Pixel wird es brauchbar, mehr schadet nicht.

Option A: Upload-Flow

1. Öffne Favicon Tool
2. Wähle bei Bild hochladen dein Logo
3. Klicke auf Favicons generieren
4. Lade anschließend das ZIP oder einzelne Dateien herunter

Option B: KI-Flow

1. Öffne den Bereich KI-Bilderstellung rechts im Tool
2. Gib entweder einen Prompt oder eine Crawl-URL ein
3. Klicke auf Bild mit KI erstellen
4. Prüfe die Vorschau und klicke auf Bild verwenden
5. SEOFuxx erstellt daraus die Favicons

Aktuell erzeugte Dateien

• favicon.ico
• favicon-16x16.png
• favicon-32x32.png
• favicon-48x48.png
• apple-touch-icon.png
• android-icon-192x192.png
• android-icon-256x256.png
• android-icon-512x512.png
• badge-72x72.png
• maskable_icon.png
• push-192x192.png

Einbindung im HTML

Diese Tags gehören mindestens in den <head>:

<link rel="icon" href="/favicon.ico" sizes="any" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />

Nach der Einbindung prüfen

Leere den Browser-Cache, lade die Seite neu und schau dir das Tab-Icon an. Auf dem Smartphone solltest du auch einen Blick auf die mobile Darstellung werfen.

Häufige Probleme

Favicon wird nicht aktualisiert

• Mach ein hartes Reload (Strg+F5)
• Teste es auch im Inkognito-Fenster
• Leere den CDN- oder Server-Cache falls du einen nutzt

KI-Bild ist nicht passend

• Formuliere den Prompt präzieser
• Probier eine andere Crawl-URL
• Erzeuge ein neues KI-Bild und nimm das stattdessen