Favicon-Generator: alle Symbole, die Ihre Website braucht
Erstellt favicon.ico, Apple- und Android-Icons und den HTML-Code aus einem Bild, Buchstaben oder Emoji.
oder hierher ziehen, oder mit Strg+V / ⌘V einfügen
Unterstützt: JPG, PNG, WebP, HEIC, SVG, AVIF, GIF, BMP, ICO, TIFF
Ihre Bilder werden in Ihrem Browser verarbeitet und nicht hochgeladen. Details zum Datenschutz
So verwenden Sie: Favicon-Generator
- 1 Wählen Sie ein Bild oder Logo oder wechseln Sie zu „Text oder Emoji“ und tippen Sie ein bis vier Zeichen.
- 2 Wählen Sie den Hintergrund (eine Farbe oder transparent), die Form und den Innenabstand.
- 3 Prüfen Sie die Vorschau in 16, 32, 48 und 180 Pixeln.
- 4 Laden Sie das ZIP herunter, legen Sie die Dateien ins Hauptverzeichnis Ihrer Website und fügen Sie die HTML-Zeilen in Ihre Seiten ein.
Über dieses Werkzeug
Ein Favicon ist das kleine Symbol in Browser-Tabs, Lesezeichen und auf dem Startbildschirm des Handys. Jeder Ort will eine andere Größe: Browser nutzen 16 und 32 Pixel, Windows bis 48, iPhones 180 und Android 192 und 512.
Dieser Generator erstellt alle aus einer Quelle: favicon.ico mit Bildern in 16, 32 und 48 Pixeln, PNG-Favicons, das Apple-Touch-Icon (immer mit Hintergrund, wie iOS es verlangt), Android-Icons, ein Web-Manifest und das HTML zum Einfügen. Starten Sie mit einem SVG-Logo, wird das SVG zusätzlich als modernes, skalierbares Favicon beigelegt.
Kleine Größen werden in mehreren Schritten verkleinert, damit Kanten scharf bleiben. Alles entsteht in Ihrem Browser; Ihr Logo wird nicht hochgeladen.
Häufig gestellte Fragen
Welche Dateien brauche ich?
favicon.ico funktioniert in jedem Browser. Die PNG-Dateien und das Apple-Touch-Icon sorgen für ein scharfes Symbol auf hochauflösenden Bildschirmen und Handy-Startbildschirmen, und das Manifest mit den Android-Icons wird genutzt, wenn jemand Ihre Website zum Android-Startbildschirm hinzufügt.
Wohin kommen die Dateien?
Ins Hauptverzeichnis Ihrer Website, sodass https://ihreseite.de/favicon.ico funktioniert. Fügen Sie dann die HTML-Zeilen in den <head>-Bereich Ihrer Seiten ein (die meisten Homepage-Baukästen haben dafür ein Feld).
Was macht ein gutes Favicon aus?
Eine einfache Form oder ein bis zwei Buchstaben mit starkem Kontrast. Feine Details und lange Texte sind bei 16 Pixeln unlesbar – prüfen Sie daher die 16-px-Vorschau.
Warum hat das Apple-Icon einen Hintergrund?
iOS zeigt transparente Touch-Icons auf schwarzem Hintergrund an, was oft falsch aussieht. Der Generator füllt das Apple-Icon deshalb immer mit Ihrer Hintergrundfarbe, oder mit Weiß, wenn Sie transparent gewählt haben.
Wird mein Logo hochgeladen?
Nein. Alle Symbole zeichnet Ihr eigener Browser, und das ZIP entsteht auf Ihrem Gerät.
Ähnliche Werkzeuge
-
PNG in ICO
PNG-Dateien in ICO umwandeln – einzeln oder viele auf einmal.
-
SVG in ICO
SVG-Dateien in ICO umwandeln – einzeln oder viele auf einmal.
-
Bild in Base64
Macht aus einem Bild eine Base64-Data-URI für HTML oder CSS – oder aus Base64-Text wieder ein Bild.
-
Bildgröße ändern
Breite und Höhe eines Bildes in Pixeln oder Prozent ändern – auf Wunsch mit festen Proportionen.