Text-Favicon-Icon-Generator

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

Empfohlen: 1-2 Zeichen für beste Ergebnisse

Text zu Icon

Geben Sie beliebigen Text ein, um professionelle Favicon-Icons mit verschiedenen Schriftarten und Stilen zu generieren

Anpassbare Stile

Reiche Anpassungsoptionen einschließlich Schriftart, Farbe, Hintergrundform und Hintergrundbild

Live-Vorschau

WYSIWYG-Live-Vorschau, passen Sie Parameter an und sehen Sie sofort die Ergebnisse

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. Es hilft Benutzern, Ihre Website schnell in mehreren geöffneten Tabs und Lesezeichen zu identifizieren.

Wie man Favicons verwendet

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

  1. Verwenden Sie unser Tool, um Favicon-Pakete zu generieren und herunterzuladen.
  2. Entpacken Sie das heruntergeladene ZIP-Paket und platzieren Sie alle Dateien im Root-Verzeichnis Ihrer Website.
  3. Fügen Sie den folgenden HTML-Code im <head>-Bereich Ihrer Website hinzu:
<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

Erklärung verschiedener Formate

ICO-Format (.ico)

Traditionelles Favicon-Format, kompatibel mit allen Browsern einschließlich älterer Versionen von Internet Explorer. Enthält normalerweise mehrere Größen (16x16, 32x32, 48x48).

PNG-Format (.png)

Bevorzugtes Format für moderne Browser, unterstützt transparente Hintergründe, kleinere Dateigröße. 16x16 für Tabs, 32x32 für Taskleiste, 48x48 für Desktop-Verknüpfungen.

Android Chrome-Icons

192x192 und 512x512 für PWA (Progressive Web Apps) auf Android-Geräten, angezeigt wenn Benutzer die Website zum Startbildschirm hinzufügen.

Apple Touch-Icons

180x180 speziell für iOS-Geräte (iPhone, iPad) entwickelt, verwendet wenn Benutzer die Website zum Startbildschirm hinzufügen. Apple fügt automatisch abgerundete Ecken und Glanzeffekte hinzu.