icons - Web app manifests

Type	`Array`
Mandatory	Yes

The icons member specifies an array of objects representing image files that can serve as application icons for different contexts. For example, they can be used to represent the web application amongst a list of other applications, or to integrate the web application with an OS's task switcher and/or system preferences.

Examples

"icons": [
  {
    "src": "icon/lowres.webp",
    "sizes": "48x48",
    "type": "image/webp"
  },
  {
    "src": "icon/lowres",
    "sizes": "48x48"
  },
  {
    "src": "icon/hd_hi.ico",
    "sizes": "72x72 96x96 128x128 256x256"
  },
  {
    "src": "icon/hd_hi.svg",
    "sizes": "72x72"
  }
]

Values

Image objects may contain the following values:

Member	Description
`sizes`	A string containing space-separated image dimensions.
`src`	The path to the image file. If `src` is a relative URL, the base URL will be the URL of the manifest.
`type`	A hint as to the media type of the image. The purpose of this member is to allow a user agent to quickly ignore images with media types it does not support.
`purpose`	Defines the purpose of the image, for example if the image is intended to serve some special purpose in the context of the host OS (i.e., for better integration). `purpose` can have one or more of the following values, separated by spaces: `monochrome`: A user agent can present this icon where a monochrome icon with a solid fill is needed. The color information in the icon is discarded and only the alpha data is used. The icon can then be used by the user agent like a mask over any solid fill. `maskable`: The image is designed with icon masks and safe zone in mind, such that any part of the image outside the safe zone can safely be ignored and masked away by the user agent. `any`: The user agent is free to display the icon in any context (this is the default value).

Specification

Specification	Status	Comment	Feedback
Web App Manifest The definition of 'icons' in that specification.	Working Draft	Initial definition.	Web App Manifest Working Group drafts

Browser compatibility

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`icons` Experimental	Chrome ?	Edge ?	Firefox ?	IE ?	Opera ?	Safari ?	WebView Android Full support Yes	Chrome Android Full support Yes	Firefox Android Full support 53 Notes Disabled Full support 53 Notes Disabled Notes By default, used for as the source for "Add to home screen" (see bug 1234558). Disabled From version 53: this feature is behind the `manifest.install.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	Opera Android ?	Safari iOS ?	Samsung Internet Android Full support Yes

Legend

Full support: Full support
Compatibility unknown: Compatibility unknown
Experimental. Expect behavior to change in the future.: Experimental. Expect behavior to change in the future.
See implementation notes.: See implementation notes.
User must explicitly enable this feature.: User must explicitly enable this feature.