Favicon-Generator
Mach ein Website-Icon aus deinem Logo, Buchstaben oder Emoji und lade das komplette Set herunter: favicon.ico, Icons für iPhone und Android, Manifest und Code zum Einfügen.
Im Browser-Tab
Alle Größen
Dateien
Code für <head>
Leg die Dateien ins Stammverzeichnis der Website, neben die Startseite, und füge diesen Code auf jeder Seite in den head-Tag ein.
Favicon in wenigen Minuten
- 1Grundlage wählenBuchstaben, Emoji oder eigenes Bild
- 2Aussehen anpassenFarben, Schrift, Rundung und Größe
- 3Set herunterladenZIP mit Icons, Manifest und Code
Text, Emoji oder Bild
Buchstaben auf farbigem Hintergrund sind die häufigste Variante: Der erste Buchstabe des Namens ist selbst bei 16 px lesbar. Ein Emoji ist ein schneller Weg zu einem auffälligen Icon ohne Designer. Das Logo sollte quadratisch sein und keine feinen Details haben: Bei 16 px verschwimmt alles Kleine.
Kleine Größe prüfen
Sieh dir die Vorschau im Tab mit hellem und dunklem Design an. Geht das Zeichen auf dem dunklen Tab unter, füge einen Hintergrund hinzu oder wähle eine hellere Farbe. Ein Rand um das Bild hilft, wenn das Logo an die Kanten stößt.
Was tun mit den Dateien
Leg alle Dateien aus dem Archiv ins Stammverzeichnis der Website, neben die Startseite, und füge den Code in den head-Bereich ein. In WordPress, Tilda und anderen Baukästen reicht es meist, favicon.ico oder ein PNG mit 512 px in den Website-Einstellungen hochzuladen.
Häufige Fragen
Keine Antwort gefunden? Schreib uns, wir helfen dir.
Hier erstellst du dein eigenes Icon von Grund auf. "Website-Favicon" macht das Gegenteil: Es findet über einen Link die Icons, die eine andere Website schon hat, und lädt sie herunter.
Mindestens favicon.ico im Stammverzeichnis: Danach suchen alle Browser. Ein PNG mit 32 px sorgt für ein scharfes Icon im Tab, apple-touch-icon.png mit 180 px für das Icon auf dem iPhone-Bildschirm, und site.webmanifest mit Icons in 192 und 512 px brauchen Android und PWA.
Drei Bilder: 16, 32 und 48 px im PNG-Format. Browser und Windows wählen die passende Größe selbst.
iOS rundet die Ecken des Icons auf dem Home-Bildschirm selbst ab und füllt transparente Stellen schwarz. Deshalb speichern wir apple-touch-icon quadratisch und mit Hintergrund: weiß, wenn du transparent gewählt hast.
Ja. Emoji werden mit der Schrift deines Systems gezeichnet: auf dem iPhone im Apple-Stil, unter Windows im Microsoft-Stil, auf Android im Google-Stil. In die Datei kommt die Version, die du in der Vorschau siehst.
Entpacke das Archiv ins Stammverzeichnis der Website und füge den Code aus dem Block "Code für <head>" in den head-Tag ein. Hat sich das Icon nicht geändert, lade die Seite ohne Cache neu: Browser merken sich alte Favicons lange.
Probieren Sie auch
Ebenfalls kostenlos und ohne Anmeldung