Web-App-Manifest-Leitfaden
Ein Web-App-Manifest (site.webmanifest) teilt installierbaren Browsern App-Name, Farben und die gewünschten Icon-Größen für den Homescreen mit. Kombinieren Sie es mit 192×192- und 512×512-PNGs für ein vollständiges PWA-Favicon-Setup.
Verlinken Sie das Manifest mit <link rel="manifest" href="/site.webmanifest">. Im JSON muss das icons-Array mindestens 192×192- und 512×512-Einträge mit type image/png und purpose any enthalten (für Android Adaptive Icons bei Bedarf maskable-Varianten ergänzen).
Setzen Sie theme_color und background_color passend zu Ihrer Marke – sie steuern die Browser-Leiste und den Splash-Screen bei der Installation.
So funktioniert es
- 1
Icon-PNGs generieren
192 und 512 px aus unserem Favicon-Generator-Paket.
- 2
site.webmanifest erstellen
name, short_name, icons, theme_color und display eintragen.
- 3
Im HTML verlinken
<link rel="manifest" href="/site.webmanifest"> plus <meta name="theme-color">.
Jetzt ausprobieren
PWA-Icon-Paket generieren
Favicon-GeneratorFAQ
Ist ein Manifest für eine einfache Website Pflicht?+
Nein – nur wenn Sie den „Zum Homescreen hinzufügen“-Dialog oder erweiterte Android-Features wünschen. Für Tabs genügt favicon.ico.
Welche Icon-Größen gehören ins Manifest?+
192×192 und 512×512 sind Pflicht für Installationsdialoge. Ergänzen Sie 384 oder maskable-Icons für den letzten Feinschliff.
Kann ich SVG im Manifest verwenden?+
Chromium unterstützt SVG in einigen Fällen, aber PNG ist der sichere Standard für browserübergreifende Install-UIs.