Il existe deux façons de changer les icônes d'applications sur iPhone. Sur les versions actuelles d'iOS, appuyez longuement sur l'écran d'accueil, ouvrez Personnaliser, et appliquez Sombre, Teinté, Effacer, ou plus grandes icons to every supported app at once (guide de l’écran d’accueil d’Apple). Pour utiliser votre propre photo pour une application, créez un Raccourcis launcher et Ajouter à l’écran d’accueil avec une image personnalisée (guide des Raccourcis d’Apple). Les développeurs d’apps peuvent aussi déployer icônes alternatives dans l'application via l’API natif d'Apple, y compris depuis Capacitor avec un bridge natif.
Les sections ci-dessous détaillent chaque approche, quand la choisir et ce qui casse si vous faites le mauvais choix.
Table des matières
- Votre guide pour personnaliser l'icône d'app sur iPhone
- Pour les utilisateurs : personnalisez vos icônes d'app iPhone
- Comprendre les compromis des icônes personnalisées
- Pour les développeurs implémentant des icônes alternatives en natif iOS
- Pour les développeurs : un guide pour Capacitor et Ionic
- L'avenir de la personnalisation est collaboratif
- Foire aux questions
Votre guide pour personnaliser l'icône d'app sur iPhone
L'écran d'accueil de l'iPhone n'est plus une simple grille d'applications depuis un certain temps. Les utilisateurs l'utilisent comme un bureau, un dashboard ou, dans certains cas, un mood board. Cela redéfinit la notion de « personnalisation ». Il ne s'agit plus seulement de changer l'apparence, mais de donner l'impression que l'appareil est organisé de manière intentionnelle.
Ce changement est important pour les deux parties. Les utilisateurs veulent des icônes qui respectent un thème, s'harmonisent avec les widgets ou réduisent l'encombrement visuel. Les développeurs veulent le permettre sans casser le rendu natif de l'app ni créer de problèmes de support avec des réglages qui ne se comportent pas comme prévu.
Il existe désormais deux couches distinctes de personnalisation d'icônes sur iPhone. L'une est user-controlled Home Screen styling, qu'Apple prend désormais en charge directement sur les appareils compatibles. L'autre est l'utilisation d'icônes alternatives gérées par l'app, où le développeur livre des variantes d'icônes dans l'app et laisse l'utilisateur choisir parmi elles. Ces deux méthodes sont liées, mais ce n'est pas la même fonctionnalité.
Règle pratique : Si vous souhaitez changer l'apparence de nombreuses icônes à la fois, commencez par les outils intégrés d'Apple pour l'écran d'accueil. Si vous essayez de remplacer une seule application par une image totalement personnalisée, utilisez la méthode des raccourcis ou une icône alternative fournie par le développeur.
Cette distinction a aussi un impact sur l'expérience utilisateur. Un écran d'accueil soigné fait partie intégrante de l'expérience globale de l'app, et non d'une entité séparée. Les équipes soucieuses de la rétention et du polish considèrent généralement la personnalisation visuelle comme un élément de l'expérience utilisateur globale de l'application mobile, et non comme un simple réglage gadget enfoui dans un menu.
Pour les utilisateurs : personnalisez vos icônes d'app iPhone
La réponse la plus simple dépend de votre objectif. Si vous voulez un style au niveau système qui préserve le comportement normal de vos apps, utilisez les contrôles natifs d’Apple. Si vous voulez une image personnalisée pour une app précise, utilisez Raccourcis.
Utilisez les contrôles intégrés d’Apple sur iPhone
Apple documente le style natif des icônes de l’écran d’accueil dans Personnaliser les apps et widgets sur l’écran d’accueil de l’iPhone. Vous pouvez créer des icônes plus grandes, les passer en Sombre ou Auto, les rendre Effacer (translucide), ou appliquer un Teinté couleur.
Le processus intégré suit les étapes d’Apple :
- Allez sur la Écran d’accueil.
- Appuyez longuement sur l’arrière-plan de l’écran d’accueil jusqu’à ce que les icônes se mettent à trembler.
- Appuyez sur Modifier, puis choisissez Personnaliser.
- Appuyez sur Sombre, Auto, Effacer, ou Teinté, ou touchez le contrôle pour créer des icônes plus grandes (les noms des apps sont masqués en grand format).
- Si vous avez choisi Teinté, utilisez les curseurs de couleur et de saturation. Vous pouvez aussi utiliser la pipette pour prélever une couleur de votre fond d'écran, puis choisir Clair, Sombre, ou Auto.
- Si vous avez choisi Effacer, choisissez Clair, Sombre, ou Auto lorsque le prompt s'affiche.
- Appuyez sur Terminé ou appuyez sur le bouton Home pour quitter le mode édition.
Cette méthode est le meilleur point de départ car elle est native. Vous ne créez pas de faux lanceurs. Vous modifiez la façon dont le système présente les icônes prises en charge.
Quelques points pratiques à retenir :
- Idéal pour une cohérence visuelle plein écran : Si votre objectif est un thème cohérent sur de nombreuses apps, c'est plus rapide que de recréer chaque icône à la main.
- Limité pour les visuels personnalisés : Vous pouvez styliser les icônes, mais vous ne pouvez pas associer une app à n'importe quelle image de votre bibliothèque Photos via ce menu.
- Plus sûr pour les apps du quotidien : Mail, Messages et les autres apps avec beaucoup de badges se comportent plus naturellement si vous les laissez en vraies icônes d'app.
Si vous combinez la teinte de l'icône avec un fond d'écran et des widgets, choisissez d'abord un fond d'écran. L'optionnel Teinté peut en extraire une couleur pour que les icônes s'accordent à votre thème.
La méthode via l'application Raccourcis reste pertinente car elle résout un problème différent.
Ce guide visuel présente le processus classique :
![]()
Utilisez la méthode Shortcuts pour n'importe quelle image
Avant le style natif, la méthode standard pour une icône d’application iPhone entièrement personnalisée était la Raccourcis Raccourcis. Vous créez toujours un raccourci qui ouvre la véritable application, puis vous l'ajoutez à l'écran d'accueil avec une photo personnalisée.
Voici la version pratique qui fonctionne :
- Ouvrez Raccourcis et touchez + pour créer un nouveau raccourci.
- Ajouter le Ouvrir l’app et choisissez l’application que vous souhaitez lancer.
- Touchez le nom du raccourci ou … pour ouvrir Détails.
- Appuyez sur Ajouter à l’écran d’accueil.
- Appuyez sur l'icône dans la Nom et icône de l'écran d'accueil zone.
- Choisissez Prendre une photo, Choisir une photo, ou Choisir un fichier pour l'image de l'icône.
- Renommez éventuellement le libellé de l'écran d'accueil, puis appuyez sur Ajoutez.
Cela vous offre une liberté visuelle que le style intégré d'Apple ne permet pas. Vous pouvez utiliser un pack d'icônes monochrome, vos propres PNG ou des assets exportés d'un outil de design.
La raison principale pour laquelle on utilise encore cette approche est le contrôle. Si vous voulez que Spotify ressemble à un glyphe dessiné à la main, ou que vos apps pro utilisent toutes la même palette neutre, Shortcuts est la solution.
Les icônes personnalisées à base d'images rendent mieux si vous harmonisez la forme, le padding et la couleur de fond avant de les ajouter. Un mélange aléatoire d'assets de packs différents rend souvent moins bien que l'écran d'accueil par défaut.
Si vous développez une web app au look natif et que vous souhaitez que votre interface soit plus cohérente avec iOS, ce guide pour configuration JS et CSS de base pour un look d'app native est un complément utile à la personnalisation des icônes.
Quelle méthode choisir selon l'utilisateur
Utilisez cette comparaison rapide pour faire votre choix :
| Objectif | Meilleure méthode | Pourquoi |
|---|---|---|
| Changer tout le style de l'écran d'accueil | Contrôles intégrés Apple | Plus rapide et préserve le comportement natif |
| Utiliser n'importe quelle image comme icône d'application | Raccourcis | Permet de choisir une photo ou un fichier |
| Garder les apps de notifications pratiques | Contrôles intégrés Apple | Mieux pour le comportement normal d'une app |
| Créer un écran thématique à partir de zéro | Raccourcis | Contrôle visuel total |
Si vous avez seulement besoin d’un rendu plus propre, ne compliquez pas les choses. Les contrôles natifs d’Apple sont plus simples. Si vous voulez une véritable direction artistique sur chaque icône, Shortcuts fait toujours l’affaire.
Comprendre les compromis des icônes personnalisées
Une icône personnalisée peut donner un écran d'accueil impeccable en une minute, puis vous agacer toute la semaine. Le revers de la médaille apparaît généralement après la configuration, pas pendant.
![]()
Ce que vous gagnez et ce que vous perdez
L'approche via les Raccourcis reste utile car elle offre une liberté visuelle totale. Mais elle ne remplace pas, au sens système, l'icône App Store de l'app. Elle crée un raccourci sur l'écran d'accueil qui lance l'app via un chemin de raccourci.
Cette différence a des conséquences réelles.
- Fiabilité des badges inexistante : Si vous dépendez des compteurs de non-lus pour le chat, les e-mails ou les tâches, les icônes de raccourci ne sont pas adaptées.
- Friction au lancement : Certains utilisateurs remarquent une brève transition lorsque le raccourci passe le relais à l'app.
- Configuration manuelle : Vous répétez le processus pour chaque application que vous personnalisez.
- Maintenance accrue : Si vous redessinez votre écran d'accueil plus tard, chaque raccourci est un objet de plus à revoir.
Ces inconvénients ne sont pas théoriques. Ils découlent directement du fonctionnement de la méthode des raccourcis. Vous ne modifiez pas le bundle de l'app, vous ajoutez un lanceur.
Si vous ouvrez une app en réaction à des alertes, ne la cachez pas derrière un raccourci cosmétique, sauf si vous êtes sûr que le comportement des badges ne vous manquera pas.
Où les icônes supportées par les développeurs diffèrent
Lorsqu'une app propose des icônes alternatives en interne, l'expérience est plus fluide car l'app participe elle-même au changement. Cela signifie généralement moins de confusion et une meilleure cohérence avec la plateforme.
Du point de vue de l'utilisateur, les icônes alternatives gérées par le développeur sont le compromis idéal entre la personnalisation générale de l'écran d'accueil d'Apple et la liberté totale des raccourcis. Vous n'avez pas un choix illimité d'images, mais vous obtenez un interrupteur qui semble voulu plutôt qu'improvisé.
Pour les équipes de design, c'est un juste milieu intéressant. Déployez un petit ensemble d'icônes validées et les utilisateurs continuent de s'approprier l'apparence de l'app. Vous protégez aussi la qualité de la marque, le contraste et la reconnaissance.
Good icon packs usually share three traits:
- Un langage de forme cohérent : Arrondi, carré, avec contour ou plein, mais sans mélange.
- Un poids visuel stable : Épaisseur de trait et espacement interne similaires.
- Discipline du thème : Mode clair, mode sombre ou une famille de styles spécifique.
C'est la même raison pour laquelle de nombreux développeurs finissent par ajouter des icônes alternatives directement dans l'app plutôt que de demander aux utilisateurs de tout gérer via des raccourcis.
Pour les développeurs implémentant des icônes alternatives en natif iOS
Si vous publiez une app iOS native, les icônes alternatives sont une petite fonctionnalité qui apporte une énorme valeur de finition. L'implémentation n'est pas difficile, mais les détails comptent. La plupart des problèmes viennent de la configuration des assets et du plist, pas de l'appel API lui-même.
![]()
Préparez les assets d'icônes et les entrées plist
Commencez par vos fichiers d'icônes. Gardez une nomenclature prévisible. Si votre icône principale est l'icône par défaut de l'app, nommez clairement les ensembles alternatifs, par exemple DarkIcon, HolidayIcon, ou MinimalIcon. N'improvisez pas de labels que les équipes produit, design et ingénierie interpréteraient chacune différemment.
Votre app a aussi besoin de la bonne structure Info.plist. Au minimum, iOS attend un CFBundleIcons un dictionnaire avec une définition d'icône principale et un dictionnaire d'icônes alternatives.
Voici un exemple simplifié :
<key>CFBundleIcons</key>
<dict>
<key>CFBundlePrimaryIcon</key>
<dict>
<key>CFBundleIconFiles</key>
<array>
<string>AppIcon</string>
</array>
</dict>
<key>CFBundleAlternateIcons</key>
<dict>
<key>DarkIcon</key>
<dict>
<key>CFBundleIconFiles</key>
<array>
<string>DarkIcon</string>
</array>
</dict>
<key>MinimalIcon</key>
<dict>
<key>CFBundleIconFiles</key>
<array>
<string>MinimalIcon</string>
</array>
</dict>
</dict>
</dict>
Certaines équipes préfèrent gérer cela dans le pipeline d'assets d'Xcode. D'autres modifient directement les valeurs du plist pour plus de clarté lors de la revue code. Les deux approches fonctionnent. L'essentiel est la cohérence entre les noms d'assets et les noms d'icônes que vous passez au runtime.
Si vous prévoyez des icônes alternatives pour l'app d'un client, incluez le temps de design et de QA dans votre périmètre dès le début. C'est le genre de fonctionnalité qui semble triviale de l'extérieur, mais qui nécessite du graphisme, des tests et des décisions produit.
Appelez l'API iOS depuis Swift
L’API au runtime est la partie facile. iOS expose le changement d'icône alternative via UIApplication.
Une implémentation simple :
import UIKit
func setAppIcon(to iconName: String?) {
guard UIApplication.shared.supportsAlternateIcons else {
return
}
UIApplication.shared.setAlternateIconName(iconName) { error in
if let error = error {
print("Failed to change icon: \(error.localizedDescription)")
} else {
print("Icon changed successfully")
}
}
}
Utiliser nil pour revenir à l'icône principale. Passez la chaîne du nom de l'icône alternative pour basculer vers une icône alternative définie.
Voici quelques notes techniques importantes :
- Vérifiez d'abord la prise en charge :
supportsAlternateIconsévite un chemin d'appel incorrect. - Respectez exactement les chaînes de caractères : Le nom du runtime doit correspondre à l'entrée du plist.
- Gérez les erreurs proprement : Un câblage d'asset incorrect ou des états non pris en charge doivent échouer visiblement en développement.
- Treat icon choice like user preference: Persistez le nom sélectionné si votre interface de paramètres doit refléter le choix actuel.
Note d'implémentation : L'appel API est simple, mais vos scénarios d'échec le sont rarement. Testez les installations neuves, les mises à niveau et la réinitialisation aux valeurs par défaut avant de livrer.
Si vous maintenez une stack hybride ou si la conformité aux stores fait partie de votre pipeline de release, ces mises à jour de la politique Apple pour les apps Capacitor méritent d'être suivies en parallèle de toute fonctionnalité de personnalisation native.
Build a settings UI that won’t confuse users
Les meilleurs sélecteurs d'icônes sont ennuyeux. C'est un compliment. Les utilisateurs doivent voir un aperçu, un nom et une cible tactile claire.
Un modèl’efficace est le suivant :
- Affichez une petite grille d'aperçus : Les utilisateurs comparent les visuels plus rapidement que les libellés de texte.
- Gardez des noms explicites : « Sombre », « Clair », « Rétro », « Fêtes » valent mieux que des noms de code internes.
- Proposez une option de réinitialisation : Rendez le retour à l'icône par défaut évident.
- Ne surchargez pas le menu : Un ensemble court et bien choisi paraît réfléchi.
Si vous voulez un réglage auquel les utilisateurs font confiance, présentez la fonctionnalité comme une personnalisation, pas une optimisation. Le choix de l'icône est immédiatement compris quand l'UI est simple.
Pour les développeurs : un guide pour Capacitor et Ionic
Dans une application Capacitor, le changement d’icône se fait toujours côté natif iOS. Votre couche web ne peut pas remplacer cela. Ce qu’elle peut faire, c’est déclencher API via un bridge côté natif et conserver le reste de l’expérience de réglages en TypeScript.
![]()
Gardez la source de vérité côté natif iOS
La première règle est simple. Placez vos assets d’icônes alternatives et votre configuration plist dans le projet iOS, pas seulement dans le projet web. Capacitor encapsule une application native. Les icônes alternatives appartiennent au bundle de cette application native.
Cela signifie que votre workflow ressemble généralement à ceci :
- Ajoutez les assets d’icônes alternatives dans la cible iOS.
- Enregistrez-les dans
CFBundleIcons. - Exposez une méthode native via un plugin Capacitor.
- Appelez cette méthode depuis votre écran de réglages Ionic, React, Vue ou web classique.
Si vous sautez l’une des deux premières étapes, aucun JavaScript ne pourra corriger cela.
Exposez le changement d'icône à TypeScript
Une interface de plugin minimale peut rester légère.
Côté Swift :
import Capacitor
import UIKit
@objc(AppIconPlugin)
public class AppIconPlugin: CAPPlugin, CAPBridgedPlugin {
public let identifier = "AppIconPlugin"
public let jsName = "AppIcon"
public let pluginMethods: [CAPPluginMethod] = [
CAPPluginMethod(name: "setIcon", returnType: CAPPluginReturnPromise)
]
@objc func setIcon(_ call: CAPPluginCall) {
let iconName = call.getString("iconName")
guard UIApplication.shared.supportsAlternateIcons else {
call.reject("Alternate icons are not supported on this device.")
return
}
UIApplication.shared.setAlternateIconName(iconName) { error in
if let error = error {
call.reject(error.localizedDescription)
} else {
call.resolve()
}
}
}
}
Définition TypeScript :
import { registerPlugin } from '@capacitor/core';
export interface AppIconPlugin {
setIcon(options: { iconName: string | null }): Promise<void>;
}
export const AppIcon = registerPlugin<AppIconPlugin>('AppIconPlugin');
Si vous devez créer ce bridge de zéro, ce guide sur l' implémentation d'un bridge natif pour iOS dans Capacitor couvre le pattern principal.
Intégrez-le dans un écran de réglages Ionic
Une fois le bridge en place, l'UI code est simple. C'est là que Capacitor fait la différence. Vous gardez la logique produit dans la couche web pendant qu'iOS gère l'appel spécifique au système.
Exemple d'utilisation :
async function changeIcon(iconName: string | null) {
try {
await AppIcon.setIcon({ iconName });
} catch (err) {
console.error('Failed to change icon', err);
}
}
Quelques décisions produit permettent de finaliser la fonctionnalité :
- Refléter le choix actuel dans l'UI : Ne forcez pas les utilisateurs à deviner quelle icône est active.
- Conditionner les contrôles spécifiques à iOS : Masquez ou désactivez l'option sur les plateformes où elle ne s'applique pas.
- Gardez les labels partagés avec le design : Utilisez les mêmes noms d'icônes dans code, les notes QA et les captures d'écran.
- Planifiez soigneusement les mises à jour d'assets : Si l'icône change après une release, coordonnez les attentes entre le web et le natif.
C'est aussi le seul endroit où un outil de release peut devenir pertinent. Si votre écran de paramètres, vos labels d'icônes, vos textes ou vos assets de prévisualisation changent plus tard, des outils comme Capgo peuvent mettre à jour le JavaScript, le CSS, les textes, la config et les assets d'une application Capacitor sans modifier le bundle d'icônes natif lui-même. Cela ne remplace pas le mécanisme d'icônes alternatives d'Apple, mais cela vous aide à itérer sur l'interface qui l'entoure.
L'avenir de la personnalisation est collaboratif
La personnalisation de l'icône d'app sur iPhone a longtemps semblé coupée en deux mondes. Les utilisateurs bricolaient, les développeurs avaient les API de la plateforme. Cette frontière s'est depuis estompée.
Pour les utilisateurs, la conclusion pratique est simple. Pour un rendu visuel rapide, la personnalisation intégrée de l'écran d'accueil d'Apple est la voie la plus simple. Pour une liberté visuelle totale sur une icône précise, l'app Raccourcis fonctionne toujours, à condition d'en accepter les compromis.
Pour les développeurs, les icônes alternatives ne sont plus un simple gadget saisonnier. Elles font partie de la finition du produit. Un sélecteur d'icônes bien conçu donne aux utilisateurs un sentiment d'appropriation sans les forcer à recourir à des contournements qui dégradent l'expérience.
Les meilleures fonctionnalités de personnalisation ne demandent pas aux utilisateurs de choisir entre esthétique et facilité d'utilisation. Elles réduisent l'écart entre les deux.
C'est d'autant plus vrai pour les stacks hybrides. Les capacités natives et l'itération produit via le web n'ont pas à s'opposer. Les équipes peuvent conserver le changement d'icône dans iOS, là où il a sa place, puis améliorer au fil du temps l'expérience des réglages autour, avec des pratiques de release soignées et une approche de déploiement progressif segmenté, surtout dans les apps qui utilisent déjà des live updates avec segmentation des utilisateurs.
La tendance de fond est positive. Apple a rendu la personnalisation de l'écran d'accueil plus native. Les utilisateurs attendent plus de contrôle. Les développeurs peuvent désormais répondre à cette attente proprement, qu'ils déploient des apps en Swift pur ou des apps Capacitor avec un bridge natif sous le capot.
Foire aux questions
Comment changer l’icône de l’application sur iPhone ?
Sur iOS 18 et versions ultérieures, touchez et maintenez l'écran d'accueil, appuyez sur Modifier, puis sur Personnaliser pour passer les icônes en mode Sombre, Transparent, Teinté ou en taille agrandie. Pour utiliser votre propre image, ouvrez l'app Raccourcis, créez un raccourci avec l'action Ouvrir une app, sélectionnez l'app, puis ajoutez-l’à l'écran d'accueil et touchez l'icône pour choisir une photo. Les étapes sont dans la section Méthode Raccourcis.
Comment changer l'icône d'une app web sur iPhone ?
Une app web ajoutée via Ajouter à l'écran d'accueil utilise l'icône déclarée par le site web, vous ne pouvez donc pas la modifier dans les Réglages. Créez un raccourci dans l'app Raccourcis avec l'action Ouvrir des URL pointant vers le site, puis ajoutez ce raccourci à l'écran d'accueil avec votre propre image. Si vous développez l'app web, définissez une icône apple touch personnalisée, ou publiez-l’en tant qu'app native avec Capacitor pour contrôler entièrement l'icône.
::: FAQ
Peut-on changer les icônes d'app sur iPhone ?
Oui. Sur une version d'iOS compatible, vous pouvez restyler chaque icône d'app de l'écran d'accueil avec les modes Sombre, Automatique, Teinté, Clair, ou des icônes plus grandes via Personnaliser. Pour utiliser votre propre image pour une app, ajoutez un lanceur Raccourcis sur l'écran d'accueil avec une photo personnalisée. :::
::: FAQ
Comment changer toutes les icônes d'app d'un coup sur iPhone ?
Maintenez le doigt sur l'arrière-plan de l'écran d'accueil jusqu'à ce que les icônes se mettent à bouger, appuyez sur Modifier, choisissez Personnaliser, puis sélectionnez Sombre, Automatique, Clair, Teinté, ou la taille d'icône plus grande. Pour Clair ou Teinté, choisissez Clair, Sombre ou Automatique pour l'apparence de ce style. Apple détaille cela dans son guide de personnalisation de l'écran d'accueil. :::
::: FAQ
Comment utiliser une image personnalisée comme icône d'application sur iPhone ?
Créez un raccourci qui ouvre l’app, ouvrez sa fiche, appuyez sur « Ajouter à l’écran d’accueil », appuyez sur l’icône et choisissez une photo ou un fichier. Cela ajoute une icône à l’écran d’accueil avec votre image. C’est un lanceur de raccourci, pas une modification de l’icône de l’App Store. :::
::: FAQ
Les icônes de raccourcis affichent-elles des badges de notification ?
Généralement pas de façon fiable. Un raccourci sur l’écran d’accueil est un lanceur distinct, donc les compteurs de non-lus et les badges de l’app réelle n’apparaissent souvent pas sur l’icône personnalisée. Utilisez le style intégré d’Apple pour les apps de mail, de chat et de tâches. :::
::: FAQ
Can Capacitor apps let users pick alternate icons?
Oui, lorsque la cible iOS définit des icônes alternatives dans Info.plist et les expose UIApplication.setAlternateIconName via un pont natif. La couche web déclenche le changement ; les assets d’icônes restent dans le bundle natif.
:::
Si vous maintenez une application Capacitor et souhaitez améliorer l’expérience de configuration autour de la sélection d’icônes, du ciblage des déploiements ou des mises à jour d’assets, Capgo est une option à envisager pour déployer des modifications de JavaScript, CSS, textes, configuration et ressources sans attendre la validation du store pour chaque ajustement d’interface.