F
Favicon.pub

Text-Favicon-Icon-Generator

Geben Sie Text ein, passen Sie den Stil an und generieren Sie Ihr eigenes Favicon.

Recommended to use 1-2 characters for best results

Text zu Icon

Geben Sie beliebigen Text ein, generieren Sie automatisch professionelle Favicons, unterstützt vielfältige Schriften und Stile

Stilanpassung

Umfangreiche Anpassungen inklusive Schriftart, Farbe, Hintergrundform und Hintergrundbild

Echtzeit-Vorschau

WYSIWYG-Echtzeitvorschau, Änderungen sofort sichtbar

Was ist ein Favicon?

Favicon (Abkürzung für favorite icon) ist ein kleines Icon, das in Browser-Tabs, Lesezeichen und anderen Interface-Elementen angezeigt wird.

Wie man Favicons verwendet

Um ein Favicon zu Ihrer Website hinzuzufügen, müssen Sie:

  1. Mit unserem Tool Favicons generieren und als ZIP herunterladen.
  2. ZIP entpacken und alle Dateien im Root Ihrer Seite ablegen.
  3. Im <head>-Bereich Ihrer Seite die entsprechenden Link-Tags hinzufügen.
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-48x48.png" sizes="48x48">
<link rel="manifest" href="/site.webmanifest">
<link rel="icon" type="image/png" href="/android-chrome-192x192.png" sizes="192x192">
<link rel="icon" type="image/png" href="/android-chrome-512x512.png" sizes="512x512">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">HTML

Favicon-Formate erklärt

ICO-Format (.ico)

Traditionelles Favicon-Format, kompatibel mit allen Browsern inklusive älterer Internet Explorer-Versionen.

PNG-Format (.png)

Modernes Browserformat mit transparentem Hintergrund, kleine Dateigröße.

Android Chrome-Icons

192x192 und 512x512 für PWA auf Android-Geräten.

Apple Touch-Icons

180x180 für iOS-Geräte, Apple versieht automatisch mit Rundungen und Glanz.