Une seule image carrée constitue désormais tout le livrable d'icône iOS. Les tailles exigées par les deux stores, ce qu'Icon Composer a remplacé, et les règles de design qui décident si quelqu'un appuie.

Une seule image carrée, 1024 sur 1024 pixels, constitue désormais tout le livrable d'icône iOS. Google Play demande 512 sur 512 en PNG 32 bits sous 1 Mo, plus une icône adaptative dans l'app. Tout le reste, le système le génère.

Si votre dernière icône date d'avant 2025, c'est exactement cette première phrase qui a changé.

La spécification

App Store Google Play
Visuel de store 1024 x 1024 px 512 x 512 px
Format SVG de préférence, PNG pour le raster et les dégradés PNG 32 bits avec alpha
Taille de fichier max. non publiée par Apple 1 024 Ko
Espace colorimétrique sRGB, Gray Gamma 2.2 ou Display P3 sRGB
Coins Fournissez un carré. Le système masque. Fournissez le carré entier. Play masque à 30 % de rayon.
Ombres N'en ajoutez pas. Le système les ajoute. N'en ajoutez pas. Play les ajoute.
Asset dans l'app Fichier Icon Composer, ou une entrée unique de 1024 px dans le catalogue Icône adaptative, 108 x 108 dp
Zone de sécurité sans objet, le masque est prévisible 66 x 66 dp centrés, 18 dp rognés de chaque côté
Apple Watch 1088 x 1088 px sans objet

Deux nombres font l'essentiel des dégâts en pratique : le 1024 d'Apple, et la zone de sécurité de 66 dp d'Android dans un canevas de 108 dp.

Ce qu'Icon Composer a changé

Apple demandait autrefois un dossier de PNG dans toutes les tailles, de 29 px à 1024 px. Ce workflow est terminé, et la plupart des guides d'icônes en ligne ne l'ont pas encore intégré.

Aujourd'hui, une icône iOS est un fichier en calques construit dans Icon Composer, jusqu'à quatre groupes de calques, exporté une fois. Xcode génère chaque déclinaison plus petite à la compilation, y compris pour les versions antérieures d'iOS. Déposez un fichier Icon Composer dans votre projet et il remplace purement et simplement votre catalogue AppIcon existant.

Si vous n'utilisez pas Icon Composer, une entrée unique de 1024 px dans le catalogue fait le même travail. Réglez l'icône sur Single Size plutôt que All Sizes. La documentation d'Apple le recommande désormais pour les projets existants qui livrent encore un set complet : "consider providing a single size when that is all your icon requires."

macOS exige toujours toutes les tailles. visionOS veut un asset de 1024 px. Ce sont les deux seules exceptions.

Six apparences, toutes optionnelles

Les icônes iOS se rendent désormais en six déclinaisons : par défaut, sombre, clear light, clear dark, tinted light et tinted dark. Sombre et tinted sont arrivées en 2024. Les déclinaisons clear sont venues avec Liquid Glass en 2025.

Vous n'êtes pas obligé de dessiner les six. Le système génère celles que vous omettez. Si vous les fournissez à la main, deux règles s'appliquent : les déclinaisons tinted doivent être en niveaux de gris, et les sombres ont besoin d'un fond transparent pour laisser passer le fond système.

Les icônes alternatives ont besoin de leurs propres déclinaisons sombre, clear et tinted. À savoir avant de promettre un set d'icônes saisonnier.

Arrêtez de précuire les effets

La consigne d'Apple est ici inhabituellement directe. N'exportez pas le masque du canevas. N'ajoutez ni reflets spéculaires, ni ombres portées entre calques, ni bords biseautés, ni flous, ni lueurs. Le système applique tout cela, et une icône pré-masquée hérite de bords dentelés et de reflets cassés.

Les calques de premier plan doivent avoir des bords nettement définis plutôt que des contours estompés. Faire varier l'opacité entre les calques de premier plan est encouragé : ça donne au système de la profondeur avec laquelle travailler. Un calque d'arrière-plan, si vous en importez un, doit être à fond perdu et opaque.

Android : la zone de sécurité fait tout

Une icône adaptative, c'est deux calques de 108 sur 108 dp chacun. Chaque constructeur applique son propre masque, donc seuls les 66 sur 66 dp centraux sont garantis. Les 18 dp extérieurs de chaque côté sont réservés au masquage, au parallaxe et aux effets de pulsation.

Votre logo doit faire au moins 48 sur 48 dp et pas plus de 66 sur 66 dp. Les calques ne doivent pas porter leurs propres masques ni ombres de contour. Le vectoriel l'emporte sur le bitmap.

Le calque monochrome, pour les icônes thématisées, est optionnel et a été introduit avec Android 13. À partir d'Android 16 QPR 2, si vous n'en fournissez pas, Android thématise votre icône automatiquement. Cette version automatique est rarement aussi bonne qu'une version dessinée.

Cinq façons de rater une icône

Conçue à 1024, jugée à 60. L'icône est validée sur un écran 27 pouces puis concourt en vignette de 60 pixels dans un résultat de recherche. Dézoomez votre plan de travail jusqu'à la taille d'un ongle. Si vous ne distinguez pas ce que c'est, le design n'est pas fini, aussi beau soit-il en grand.

Du texte dans l'icône. La position d'Apple : le texte ne se localise pas, ne sert pas l'accessibilité et est généralement trop petit pour être lu. Des mots comme Play, Watch ou New sont les pires, parce qu'ils n'apportent rien. Le nom de votre app est déjà imprimé juste en dessous de l'icône.

Des coins arrondis intégrés. Les deux stores masquent pour vous. Arrondir vous-même sur iOS casse les reflets spéculaires ; sur Play, ça produit une icône visiblement arrondie deux fois. La documentation de Google le dit deux fois : n'arrondissez pas les bords, n'ajoutez pas d'ombres portées.

Logo Android dessiné sur tout le canevas. Dessinez à 108 dp, publiez, et Samsung rogne votre logo. La zone de sécurité de 66 dp n'est pas une suggestion.

Des arguments de performance dans le visuel. Google interdit explicitement les icônes indiquant un classement, un prix, une promotion ou un programme Play. Badges de récompense, "#1", "Editor's choice", bandeaux de réduction et fausses pastilles de notification sont tous nommés dans la règle. Apple n'a pas d'équivalent : une icône qui passe chez Google passe donc des deux côtés.

Comment en concevoir une qui marche

Choisissez une forme et une idée. Les icônes lisibles en vignette sont une silhouette unique à fort contraste sur son fond, et presque rien d'autre. Regardez les cinq premiers résultats de votre terme principal, à taille réelle : vous remarquerez le peu d'entre elles qui contiennent plus d'un objet.

La couleur travaille plus que la forme aux petites tailles. Choisissez un fond qui vous distingue des quatre concurrents placés à côté de vous dans la recherche, pas celui qui s'accorde à votre site.

Testez-la ensuite correctement : sur un écran d'accueil parmi de vraies apps, dans un résultat de recherche à côté de concurrents, en mode sombre et en tinted. Ça fait quatre contextes, et une icône qui ne fonctionne que dans le premier vous coûte des installations dans les trois autres sans jamais apparaître comme un problème.

Où ça se situe dans le travail

Votre icône et vos deux premières captures décident si un résultat de recherche devient une installation, et les stores réinjectent ce taux de conversion dans votre classement de la semaine suivante. C'est donc une tâche d'ASO, pas de branding. Le guide des captures couvre l'autre moitié, et qu'est-ce que l'ASO explique comment les deux se relient à vos métadonnées.

L'agent assets produit une icône accordée à votre marque pour chaque appareil. Vous recevez un brouillon à valider, pas un brief de design à rédiger.

Rien ne passe en ligne tant que vous ne l'avez pas approuvé.

Cet article vous a-t-il aidé ?