Constructeur de Manifeste PWA
Générez un Manifeste d'Application Web complet pour votre PWA.
{
"name": "My PWA App",
"short_name": "MyApp",
"description": "A Progressive Web Application",
"start_url": "/",
"scope": "/",
"display": "standalone",
"orientation": "any",
"theme_color": "#000000",
"background_color": "#ffffff",
"lang": "en",
"categories": [
"utilities"
],
"icons": [
{
"src": "/icons/icon-72x72.png",
"sizes": "72x72",
"type": "image/png"
},
{
"src": "/icons/icon-96x96.png",
"sizes": "96x96",
"type": "image/png"
},
{
"src": "/icons/icon-128x128.png",
"sizes": "128x128",
"type": "image/png"
},
{
"src": "/icons/icon-144x144.png",
"sizes": "144x144",
"type": "image/png"
},
{
"src": "/icons/icon-152x152.png",
"sizes": "152x152",
"type": "image/png"
},
{
"src": "/icons/icon-192x192.png",
"sizes": "192x192",
"type": "image/png",
"purpose": "any maskable"
},
{
"src": "/icons/icon-384x384.png",
"sizes": "384x384",
"type": "image/png"
},
{
"src": "/icons/icon-512x512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "any maskable"
}
]
}<link rel="manifest" href="/manifest.json" /> <meta name="theme-color" content="#000000" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="default" /> <meta name="apple-mobile-web-app-title" content="MyApp" />
Qu'est-ce que le constructeur de manifest PWA ?
Cet outil génère JSON Web App Manifest complet pour Progressive Web App — avec nom, icônes, thème, mode d'affichage.
Comment créer manifest
- Saisissez nom et nom court d'app.
- Uploadez icônes (192×192, 512×512).
- Sélectionnez couleurs de thème et fond.
- Sélectionnez mode d'affichage.
- Copiez le JSON généré.
Champs requis
- name, short_name (noms d'app)
- icons (192×192, 512×512)
- start_url (page par défaut)
- display (standalone/fullscreen)
- theme_color, background_color
Questions fréquemment posées
- Qu'est-ce que le Web App Manifest ?
- Fichier JSON qui définit la PWA (Progressive Web App) — nom, icône, couleur de thème, mode d'affichage, URL de start. Active la fonction "Ajouter à l'écran d'accueil" du navigateur.
- Quels sont les champs requis ?
- name, short_name, icons (192×192, 512×512), start_url, display (standalone/fullscreen). theme_color, background_color recommandés. Service worker séparé — manifest définit seulement comportement d'installation.
- Quels sont les modes d'affichage ?
- standalone — paraît comme app native, sans UI navigateur. fullscreen — écran complet, immersif. minimal-ui — contrôles navigateur minimaux. browser — onglet régulier. La plupart des PWAs utilisent standalone.
- Différence entre PWA et app native ?
- PWA : technologies web, multi-plateforme, sans app store, mises à jour instantanées. Native : meilleure performance, accès complet à l'appareil (NFC, BLE limités), présence en app store. Solutions hybrides existent aussi (Capacitor, Cordova).
Outils associés
- Générateur d'Icônes d'Application
Générez toutes les tailles d'icônes iOS et Android à partir d'une seule image.
- Générateur de Lien Profond
Générez des URLs de schéma personnalisé, des URLs d'Intent Android et des Universal Links iOS.
- Maquette de Capture d'Écran pour la Boutique d'Applications
Créez des maquettes de captures d'écran pour l'App Store et le Play Store avec des cadres d'appareils.
- Référence des Tailles d'Écran Mobile
Référence 2025–2026 pour les tailles d'écran de l'iPhone 17, Galaxy S25 et Pixel 9a.