Favicons

Die Icons in dieser Sammlung wurden für unterschiedliche Verwendungszwecke gestaltet, die unten aufgelistet sind.

The provided icons in this package are designed for different purposes listed below.

Verwendung Html Bild Typ Größe
Default 
<link rel="icon" href="your_path/Berlin_de.svg" type="image/svg+xml">
 svg 500x500
Fallback 
<link rel="icon" href="your_path/favicon.ico" sizes="any">
 ico 16x16, 32x32 und 48x48
Safari Pinned Tab 
<link rel="mask-icon" href="your_path/safari-pinned-tab.svg" color="#000000">
 svg 700x700
Apple Touch Icon 
<link rel="apple-touch-icon" href="your_path/apple-touch-icon.png">
 png 180x180
Web applications as native apps 
<link rel="manifest" href="your_path/manifest.json">
 - json -
Berlin_de-192x192.png: see manifest.json below for details png 192x192
Berlin_de-512x512.png: see manifest.json below for details png 512x512
Facebook-/Whatsapp posts etc 
<meta name="og:image" content="your_path/Berlin_de_FB_Social.png">
<meta name="og:image:secure_url" content="your_path/Berlin_de_FB_Social.png">
 png 1080×565
Microsoft Tile 
<meta name="msapplication-config" content="your_path/browserconfig.xml">
<meta name="msapplication-TileColor" content="#2b5797">
<meta name="theme-color" content="#ffffff">
 - xml -
mstile-150x150.png: see browserconfig.xml below for details png 150x150
Complete Html: 
<link rel="icon" href="your_path/favicon.ico" sizes="any">
<link rel="icon" href="your_path/Berlin_de.svg" type="image/svg+xml">
<link rel="mask-icon" href="your_path/safari-pinned-tab.svg" color="#000000">
<link rel="apple-touch-icon" href="your_path/apple-touch-icon.png">
<link rel="manifest" href="your_path/manifest.json">
<meta name="og:image" content="your_path/Berlin_de_FB_Social.png">
<meta name="og:image:secure_url" content="your_path/Berlin_de_FB_Social.png">
<meta name="msapplication-TileColor" content="#2b5797">
<meta name="msapplication-config" content="your_path/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
manifest.json 
{
	"icons": [
		{
			"src": "your_path/Berlin_de-192x192.png", 
			"type": "image/png", 
			"sizes": "192x192"
		},
		{
			"src": "your_path/Berlin_de-512x512.png", 
			"type": "image/png", 
			"sizes": "512x512"
		}
	]
}
browserconfig.xml 
<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
    <msapplication>
        <tile>
            <square150x150logo src="your_path/mstile-150x150.png">
            <TileColor>#2b5797</TileColor>
        </tile>
    </msapplication>
</browserconfig>

Downloads