Classic and SVG favicons
Browser
Light theme
Dark theme
Google Result Page
Light theme
Example
https://example.com
Lorem Ipsum
Lorem ipsum dolor sit amet, consectetur
adipiscing elit...
Dark theme
Example
https://example.com
Lorem Ipsum
Lorem ipsum dolor sit amet, consectetur
adipiscing elit...
Regular icon
The regular icon is displayed in most situations.
0%
100%
Dark icon
In dark themes, your icon is different.
0%
100%
Apple Touch Icon
iOS Preview
If empty, iOS will use the page title
100%
Web app manifest
Android Preview
100%
site.webmanifest
{
"name": "",
"short_name": "",
"icons": [
{
"src": "/web-app-manifest-192x192.png",
"sizes": "192x192",
"type": "image/png",
"purpose": "maskable"
},
{
"src": "/web-app-manifest-512x512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
}
],
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone"
}