theme_color vs background_color (manifeste)
Dans un manifeste d'application web, theme_color teinte l'interface du système d'exploitation autour de votre application installée (la barre d'état et la zone de titre) tandis que background_color peint l'écran de démarrage affiché pendant le chargement de l'application, avant que votre CSS ne s'applique. Ce sont des champs distincts pour des moments distincts. La balise <meta name="theme-color"> fait le travail de theme_color pour un onglet de navigateur normal.
Deux couleurs, deux moments
theme_color est affichée pendant que votre application tourne : l'OS l'utilise pour teinter l'habillage autour de la fenêtre, comme la barre d'état et la zone de titre. background_color est affichée plus tôt. C'est la couleur unie de l'écran de démarrage que l'OS dessine pendant que l'application se charge encore, avant qu'aucun de vos CSS ne s'applique.
Régler background_color sur environ le fond de votre page rend le lancement fluide ; la laisser par défaut vous donne un flash blanc avant que votre application ne se dessine.
Laquelle est laquelle
| Champ | Quand elle s'affiche | Ce qu'elle colore |
|---|---|---|
| theme_color | Application en cours | Interface de l'OS, barre d'état |
| background_color | Pendant le lancement | L'écran de démarrage |
FAQ sur les couleurs du manifeste
Quelle est la différence entre theme_color et background_color ?
theme_color teinte l'interface de l'OS autour d'une application installée en cours d'exécution ; background_color est la couleur de l'écran de démarrage affichée pendant que l'application se lance encore. Surfaces différentes, moments différents.
Pourquoi l'écran de démarrage de ma PWA est-il de la mauvaise couleur ?
Cette couleur vient de background_color dans le manifeste. Réglez-la pour qu'elle corresponde au fond de votre application afin qu'il n'y ait pas de flash brutal avant le chargement de votre CSS.
Ai-je encore besoin de la balise meta theme-color ?
Oui, pour les onglets de navigateur normaux. Le theme_color du manifeste ne s'applique qu'à l'application installée. Gardez la balise meta et la valeur du manifeste synchronisées.