Bild hier ablegen oder zum Durchsuchen klicken
PNG, JPG, SVG — empfohlen 512×512 px oder größer
| Size | Filename | Use case |
|---|---|---|
| 16×16 | favicon-16x16.png | Browser tab (most common) |
| 32×32 | favicon-32x32.png | Browser tab (HiDPI), taskbar shortcut |
| 48×48 | favicon.ico (embedded) | Windows taskbar pinned sites |
| 57×57 | favicon-57x57.png | iOS non-retina home screen (legacy) |
| 72×72 | favicon-72x72.png | iPad non-retina (legacy) |
| 96×96 | favicon-96x96.png | Android, Google TV |
| 114×114 | favicon-114x114.png | iPhone retina (legacy) |
| 144×144 | favicon-144x144.png | iPad retina, Windows 8 tile |
| 152×152 | favicon-152x152.png | iPad retina (iOS 7+) |
| 180×180 | apple-touch-icon.png | iPhone / iPad modern (iOS 8+) |
| 192×192 | android-chrome-192x192.png | Android Chrome, PWA manifest |
| 512×512 | android-chrome-512x512.png | PWA splash screen, maskable icon |
<link rel="icon" type="image/x-icon" href="/favicon.ico" /> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" /> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" /> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" /> <link rel="manifest" href="/site.webmanifest" />
Moderne Browser benötigen: 16×16 und 32×32 (Browser-Tab/Verknüpfung), 48×48 (Windows-Taskleiste), 57×57 und 72×72 (iOS ohne Retina), 96×96 (Android Chrome), 114×114 und 144×144 (iOS/Android Retina), 152×152 und 180×180 (iOS-Startbildschirm), 192×192 und 512×512 (PWA-Splash/Maskierbar). Die .ico-Datei sollte mindestens 16×16, 32×32 und 48×48 einbetten.
Verwenden Sie ein quadratisches PNG oder SVG mit 512×512 px oder größer für beste Ergebnisse. Vermeiden Sie Bilder mit wichtigen Details nahe den Rändern, da diese in kreisförmigen/abgerundeten Formaten abgeschnitten werden können. SVG ist ideal, da es ohne Qualitätsverlust skaliert.
Ja, wenn Ihre Website als Progressive Web App (PWA) installierbar sein soll. Das Manifest referenziert die 192×192 und 512×512 Symbole. Moderne Browser verwenden das Manifest auch für Android-Startbildschirm-Verknüpfungen.
Platzieren Sie alle generierten Dateien im Stammverzeichnis Ihrer Website und fügen Sie diese Tags zu Ihrem HTML '<'head> hinzu: '<'link rel="icon" type="image/x-icon" href="/favicon.ico">, '<'link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">, '<'link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> und '<'link rel="manifest" href="/site.webmanifest">.