theme_color против background_color (манифест)
В веб-манифесте приложения theme_color тонирует интерфейс операционной системы вокруг установленного приложения (строку состояния и область заголовка), а background_color красит экран загрузки, показываемый, пока приложение грузится, до того как применится ваш CSS. Это отдельные поля для отдельных моментов. Тег <meta name="theme-color"> выполняет задачу theme_color для обычной вкладки браузера.
Два цвета, два момента
theme_color показывается, пока ваше приложение работает: ОС использует его, чтобы тонировать интерфейс вокруг окна, вроде строки состояния и области заголовка. background_color показывается раньше. Это плоский цвет экрана загрузки, который ОС рисует, пока приложение ещё грузится, до того как применился любой ваш CSS.
Установка background_color примерно в цвет фона вашей страницы делает запуск бесшовным; оставленное по умолчанию даёт белую вспышку, прежде чем ваше приложение отрисуется.
Что есть что
| Поле | Когда показывается | Что красит |
|---|---|---|
| theme_color | Приложение работает | Интерфейс ОС, строка состояния |
| background_color | Во время запуска | Экран загрузки |
Частые вопросы о цветах манифеста
В чём разница между theme_color и background_color?
theme_color тонирует интерфейс ОС вокруг работающего установленного приложения; background_color — это цвет экрана загрузки, показываемый, пока приложение ещё запускается. Разные поверхности, разные моменты.
Почему у моего PWA неправильный цвет экрана загрузки?
Этот цвет берётся из background_color в манифесте. Задайте его в тон фону вашего приложения, чтобы не было резкой вспышки до загрузки вашего CSS.
Нужен ли мне ещё мета-тег theme-color?
Да, для обычных вкладок браузера. theme_color манифеста применяется только к установленному приложению. Держите мета-тег и значение манифеста синхронными.