Favikonki


favicon.ico
favicon.ico
16 x 16
favicon-16x16.png
favicon-16x16.png
16 x 16
favicon-32x32.png
favicon-32x32.png
32 x 32
favicon-96x96.png
favicon-96x96.png
96 x 96
favicon-128x128.png
favicon-128x128.png
128 x 128
favicon-196x196.png
favicon-196x196.png
196 x 196
apple-touch-icon-57x57.png
apple-touch-icon-57x57.png
57 x 57
apple-touch-icon-60x60.png
apple-touch-icon-60x60.png
60 x 60
apple-touch-icon-72x72.png
apple-touch-icon-72x72.png
72 x 72
apple-touch-icon-76x76.png
apple-touch-icon-76x76.png
76 x 76
apple-touch-icon-114x114.png
apple-touch-icon-114x114.png
114 x 114
apple-touch-icon-120x120.png
apple-touch-icon-120x120.png
120 x 120
apple-touch-icon-144x144.png
apple-touch-icon-144x144.png
144 x 144
apple-touch-icon-152x152.png
apple-touch-icon-152x152.png
152 x 152
apple-touch-icon-167x167.png
apple-touch-icon-167x167.png
167 x 167
apple-touch-icon-180x180.png
apple-touch-icon-180x180.png
180 x 180
apple-touch-icon.png
apple-touch-icon.png
144 x 144
mstile-70x70.png
mstile-70x70.png
70 x 70
mstile-150x150.png
mstile-150x150.png
150 x 150
mstile-270x270.png
mstile-270x270.png
270 x 270
mstile-310x310.png
mstile-310x310.png
310 x 310
mstile-310x150.png
mstile-310x150.png
310 x 150
msapplication-icon-144x144.png
msapplication-icon-144x144.png
144 x 144
android-chrome-228x228.png
android-chrome-228x228.png
228 x 228
android-chrome-192x192.png
android-chrome-192x192.png
192 x 192
android-chrome-512x512.png
android-chrome-512x512.png
512 x 512
favicon-228x228.png
favicon-228x228.png
228 x 228
Nagłówek (head) pliku HTML
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-96x96.png" sizes="96x96">
<link rel="icon" type="image/png" href="/favicon-128x128.png" sizes="128x128">
<link rel="icon" type="image/png" href="/favicon-196x196.png" sizes="196x196">
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon.png" sizes="144x144"/>
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-57x57.png" sizes="57x57"/>
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-60x60.png" sizes="60x60"/>
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-72x72.png" sizes="72x72"/>
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-76x76.png" sizes="76x76"/>
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-114x114.png" sizes="114x114"/>
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-120x120.png" sizes="120x120"/>
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-144x144.png" sizes="144x144"/>
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-152x152.png" sizes="152x152"/>
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-167x167.png" sizes="167x167"/>
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-180x180.png" sizes="180x180"/>
<meta name="application-name" content="&nbsp;" />
<meta name="msapplication-TileColor" content="#FFFFFF" />
<meta name="msapplication-TileImage" content="/mstile-144x144.png" />
<meta name="msapplication-square70x70logo" content="/mstile-70x70.png"/>
<meta name="msapplication-square150x150logo" content="/mstile-150x150.png"/>
<meta name="msapplication-square270x270logo" content="/mstile-270x270.png"/>
<meta name="msapplication-square310x310logo" content="/mstile-310x310.png"/>
<meta name="msapplication-wide310x150logo" content="/mstile-310x150.png" />
<link rel="icon" type="image/png" href="/favicon-228x228.png" sizes="228x228">
Wpisy do nuxt.config.js
    meta: [
      // Windows icons
      { name: 'application-name', content: pkg.name },
      { name: 'msapplication-TileColor', content: '#FFFFFF' },
      { name: 'msapplication-TileImage', content: '/mstile-144x144.png' },
      { name: 'msapplication-square70x70logo', content: '/mstile-70x70.png' },
      { name: 'msapplication-square150x150logo', content: '/mstile-150x150.png' },
      { name: 'msapplication-square270x270logo', content: '/mstile-270x270.png' },
      { name: 'msapplication-square310x310logo', content: '/mstile-310x310.png' },
      { name: 'msapplication-wide310x150logo', content: '/mstile-310x150.png' },
    ],
    link: [
      // Favicons
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
      { rel: 'icon', type: 'image/png', href: '/favicon-16x16.png', size: '16x16' },
      { rel: 'icon', type: 'image/png', href: '/favicon-32x32.png', size: '32x32' },
      { rel: 'icon', type: 'image/png', href: '/favicon-96x96.png', size: '96x96' },
      { rel: 'icon', type: 'image/png', href: '/favicon-128x128.png', size: '128x128' },
      { rel: 'icon', type: 'image/png', href: '/favicon-196x196.png', size: '196x196' },
      // Apple icons
      { rel: 'apple-touch-icon-precomposed', href: '/apple-touch-icon.png', size: '144x144' },
      { rel: 'apple-touch-icon-precomposed', href: '/apple-touch-icon-57x57.png', size: '57x57' },
      { rel: 'apple-touch-icon-precomposed', href: '/apple-touch-icon-60x60.png', size: '60x60' },
      { rel: 'apple-touch-icon-precomposed', href: '/apple-touch-icon-72x72.png', size: '72x72' },
      { rel: 'apple-touch-icon-precomposed', href: '/apple-touch-icon-76x76.png', size: '76x76' },
      { rel: 'apple-touch-icon-precomposed', href: '/apple-touch-icon-114x114.png', size: '114x114' },
      { rel: 'apple-touch-icon-precomposed', href: '/apple-touch-icon-120x120.png', size: '120x120' },
      { rel: 'apple-touch-icon-precomposed', href: '/apple-touch-icon-144x144.png', size: '144x144' },
      { rel: 'apple-touch-icon-precomposed', href: '/apple-touch-icon-152x152.png', size: '152x152' },
      { rel: 'apple-touch-icon-precomposed', href: '/apple-touch-icon-167x167.png', size: '167x167' },
      { rel: 'apple-touch-icon-precomposed', href: '/apple-touch-icon-180x180.png', size: '180x180' },
      // Other icons
      { rel: 'icon', type: 'image/png', href: '/favicon-228x228.png', size: '228x228' },
    ],
browserconfig.xml
<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
  <msapplication>
    <tile>
      <square70x70logo src="/mstile-70x70.png"/>
      <square150x150logo src="/mstile-270x270.png"/>
      <square310x310logo src="/mstile-310x310.png"/>
      <wide310x150logo src="/mstile-310x150.png"/>
      <TileColor>#ffffff</TileColor>
    </tile>
  </msapplication>
</browserconfig>