Ionic - 9.6 Régler toutes les couleurs du thème d'un coup
Changer une seule couleur ne suffit pas toujours. Ionic calcule automatiquement certaines variantes, comme le contraste ou les nuances, à partir de la couleur de base. Cette leçon montre comment régler l'ensemble des couleurs en une seule fois.
Pourquoi changer un bloc entier
Si l'on modifie uniquement la première couleur, le résultat peut être incohérent. Ionic utilise parfois d'autres couleurs, par exemple pour le contraste ou les nuances.
Il faut donc remplacer les couleurs par bloc complet, en partant d'un générateur de couleurs.
Utiliser le générateur de couleurs
La documentation Ionic propose un générateur de couleurs. On choisit ses couleurs sur une roue, et l'aperçu se met à jour immédiatement. Le code correspondant est généré automatiquement.
Une fois le résultat satisfaisant, on copie le code généré.
Remplacer le bloc dans le fichier de variables
On ouvre le fichier de variables du thème et l'on remplace l'ancien bloc de couleurs par le code copié.
Les couleurs de toute l'application changent alors ensemble, de façon cohérente.
En résumé
Ionic calcule certaines couleurs à partir de la couleur de base, il faut donc les régler par bloc. Le générateur de couleurs de la documentation fournit un code prêt à copier. Ce code remplace le bloc de couleurs dans le fichier de variables du thème.
Points clés
- Ionic dérive certaines couleurs, comme le contraste, à partir de la couleur de base.
- Modifier une seule couleur peut donner un résultat incohérent.
- Le générateur de couleurs de la documentation produit le code automatiquement.
- Le code copié remplace le bloc de couleurs du fichier de variables.
Questions fréquentes
Pourquoi ne pas modifier une seule couleur ?
Ionic utilise parfois d'autres couleurs, comme le contraste, ce qui peut créer des incohérences.
Comment obtenir le code des couleurs ?
Le générateur de couleurs de la documentation Ionic produit le code automatiquement, à partir des couleurs choisies.
Où coller le code généré ?
Dans le fichier de variables du thème, à la place de l'ancien bloc de couleurs.