Guide favicon et PWA
Produisez aussi les icones web standards en parallele.
Zone sure des icones maskable
Conservez le contenu essentiel dans une zone centrale sure pour limiter le rognage sur Android.
Checklist source
- Utilisez une source PNG/SVG avec silhouette nette.
- 1024×1024 est recommande pour une bonne qualite 512.
- Simplifiez les details fins pour mieux resister aux masques de forme.
Flux pratique
- Importez la source puis activez le mode Securise.
- Controlez l’apercu maskable et verifiez l’eloignement des bords.
- Utilisez une couleur de fond stable si votre logo depend d’espaces transparents.
- Exportez icon-maskable-192x192 et 512x512 via le ZIP.
Exemple complet
Entree : Logo d’application PNG avec transparence.
Parametres : Marge securisee + fond uni pour compatibilite launcher.
Sortie : Le sujet reste lisible dans les decoupes cercle/squircle.
Conseils safe-area
- Evitez de placer texte, traits fins ou coins importants pres du bord externe.
- Testez l’icone sur fond clair et fonce lorsque c’est possible.
- Gardez les exports normaux et maskable dans le meme dossier de release.
FAQ
Pourquoi l’icone maskable differe de l’icone 512 classique ?
Elle doit garder plus d’espace de securite car le launcher applique un masque.
Fond transparent ou uni pour maskable ?
Le fond uni donne souvent un rendu plus stable selon les launchers.
Comment detecter un sujet trop proche des bords ?
Si texte/logo touche la limite de l’apercu, passez en mode Securise.
Scenarios icones associes
Guide SVG vers pack
Partir d’un SVG et exporter tous les fichiers en un flux.
Outils associes
Base64 Encode / Decode
Convertissez vos assets image en Base64 pour debug ou integration.
Outil QR Code
Generez des QR codes pour pages d’installation app et liens QA.
Timestamp Converter
Convertissez les timestamps de release ou cache-busting pendant les checks.