Manifest Contains theme_color

Why the audit is important

When a user accesses your app on Chrome for Android, the theme_color property of your Web App Manifest determines the color of the address bar. This takes effect whether or not the user has added your app to the homescreen.

How to pass the audit

Add a theme_color property in your Web App Manifest. The value can be any valid CSS color.

{
  ...
  "theme_color": "cornflowerblue",
  ...
}

Check out Manifest Exists for a list of guides that teach you how to properly implement and test "Add to Homescreen" support in your app.

How the audit is implemented

This section explains how this audit is implemented, so that you can understand how the audit's score is calculated.

Audit passes if the manifest contains a theme_color property. The manifest that Lighthouse fetches is separate from the one that Chrome is using on the page, which can possibly cause inaccurate results. Lighthouse does not validate that the value is a valid CSS color.

Feedback