Icons
Last updated
Last updated
To integrate the icon details into the Progressive Web App (PWA) manifest file, ensure that each icon listed is accompanied by its respective size. For example, icon-256x256.png
is indicated as having a size of 256px by 256px. This is crucial for providing clear visual elements across different devices and resolutions.
The sizes
attribute indicates the size of the icon to the browser. For PNG or JPEG icons, specify the dimensions (e.g., 48, 96, 256). For vector icons, you can use "any" as they are scalable without losing quality. The format
attribute is also important as it tells the browser what the file format is, helping it to render the image correctly or the browser to select the most suitable format.
src
ParameterThe src
parameter is the path to the resource file. It can be an , a relative path or an absolute path to the resource.
sizes
ParameterThe sizes parameter indicates the suitable sizes for the icon. The expected value is an positive integer or a list of positive integers.
0
means any
size and is suitable only for vector images.
The recommended sizes for application icons are as 48, 72, 96, 144, 168, 192, 256 and 512 pixels.
format
ParameterThe format
parameter corresponds to the mime type of the icon.
If this value is omitted and the component symfony/mime
is present, the bundle will guess the correct type.
In general, browsers can read image/png
and image/jpg
types. Modern browsers may support image/webp
.
purpose
ParameterThe purpose maskable
icons indicates the icon has a security margin and borders can be cropped on certain devices.