Qu'est-ce que Générateur de zone sûre d'icône PWA ?
Une icone maskable est une icone PWA qui peut s'adapter a differentes formes de plateforme. Android peut l'afficher sous forme de cercle, de squircle ou de carre arrondi selon l'appareil. La zone de securite est la partie interieure de l'icone dont la visibilite est garantie quelle que soit la forme. Les directives PWA recommandent que le contenu important de l'icone remplisse au moins 80% du canevas.
Réponse rapide
Telechargez votre icone PWA carree pour previsualiser la zone de securite maskable. Gardez le contenu important a l'interieur de la zone de securite (les 80% interieurs de l'icone). Exportez les entrees du manifeste avec les deux purposes any et maskable aux tailles 192x192 et 512x512.
Last updated: 2026-05-28
Limites
- L'aperçu montre une zone de securite circulaire, mais les formes reelles des plateformes varient (squircles, carres arrondis, cercles).
- Cet outil fournit un aperçu visuel uniquement. Il n'exporte pas de fichiers PNG réels.
- Certaines plateformes appliquent des transformations supplementaires au-dela du recadrage maskable.
Sources:MDN Web Docs · W3C Specifications · jquery.app on GitHub
Comment utiliser cet outil
- Telechargez une icone PNG carree (512x512 ou plus recommandee) pour votre PWA.
- Ajustez le pourcentage de remplissage de la zone de securite - 15% (standard PWA) signifie une zone de securite visible de 85%.
- Previsualisez la superposition sur l'icone pour confirmer que le contenu important est a l'interieur du cercle de securite.
- Copiez les entrees du manifeste avec purpose: maskable et exportez vos icones aux tailles 192x192 et 512x512.
A quoi il sert
- Verifier que les elements visuels cles de votre icone d'application restent dans la zone de securite maskable avant le deploiement en production.
- Generer des entrees de manifeste correctement configurees avec les bonnes tailles, purpose et type.
- Previsualiser comment differentes valeurs de remplissage affectent la partie visible de votre icone.