LogoDocumentazione AppIconGenerator
LogoDocumentazione AppIconGenerator
HomepageDocumentazione AppIconGeneratorPrimi passiDimensioni delle icone Apple per iOSDimensioni Android: icone legacy e livelli adattiviIcone Web, PWA e Chrome
X (Twitter)

Icone Web, PWA e Chrome

Installa favicon e manifest PWA e verifica le dimensioni delle icone e immagini promozionali Chrome.

Lo ZIP Web contiene favicon.ico, PNG da 16/32 px, icona Apple touch da 180 px, icone PWA da 192/512 px, site.webmanifest e og.png da 1200x630.

Contenuto dello ZIP Web

I due PNG PWA sono normali icone quadrate. Nomi e dimensioni corrispondono all'array icons in site.webmanifest; og.png è un'immagine separata per la condivisione.

Web/
  favicon.ico
  favicon-16x16.png
  favicon-32x32.png
  apple-touch-icon.png
  android-chrome-192x192.png
  android-chrome-512x512.png
  site.webmanifest
  og.png
  README.txt

Collega le icone al sito

  1. Copia i file di Web nella cartella pubblica del sito e pubblicali nella radice del dominio, oppure adatta i percorsi alla cartella scelta.
  2. Modifica name e short_name in site.webmanifest. start_url e scope sono relativi al manifest; i percorsi esportati delle icone iniziano con /. Adattali se le immagini sono in una sottocartella.
  3. Aggiungi i link del manifest, favicon e Apple touch nell'head HTML. Usa HTTPS o localhost. Negli strumenti del browser controlla il manifest e che ogni URL restituisca un'immagine, non una pagina HTML di fallback.
<link rel="manifest" href="/site.webmanifest">
<link rel="icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
{
  "name": "My App",
  "short_name": "App",
  "start_url": "./",
  "scope": "./",
  "icons": [
    { "src": "/android-chrome-192x192.png", "sizes": "192x192", "type": "image/png" },
    { "src": "/android-chrome-512x512.png", "sizes": "512x512", "type": "image/png" }
  ],
  "theme_color": "#ffffff",
  "background_color": "#ffffff",
  "display": "standalone"
}

Queste icone non sono preparate come immagini maskable. Lo ZIP non aggiunge service worker o supporto offline; le sole icone non garantiscono l'installazione. Prova browser e dispositivo di destinazione.

Generatore di Favicon e Icone PWA

Esporta icone e immagini promozionali Chrome

Carica un'immagine e scegli Chrome per scaricare PNG e immagini rettangolari. L'immagine è centrata su bianco; completa il design prima dell'invio allo store.

  • Icone dell'estensione: PNG da 16, 32, 48 e 128 px e file iniziale Manifest V3.
  • Icona store (128x128): PNG separato per la scheda Chrome Web Store.
  • Riquadro piccolo (440x280): PNG opaco per lo spazio promozionale piccolo.
  • Marquee (1400x560): Immagine promozionale grande facoltativa, distinta da uno screenshot.
  • Screenshot: Cattura l'estensione separatamente a 1280x800 o 640x400. Lo strumento non acquisisce né incornicia schermate.

Generatore di icone e immagini per estensioni Chrome

Riferimenti ufficiali

  • Web App Manifest
  • Chrome Web Store

Dimensioni Android: icone legacy e livelli adattivi

Il launcher Android usa bitmap per densità.

Indice

Contenuto dello ZIP Web
Collega le icone al sito
Esporta icone e immagini promozionali Chrome
Riferimenti ufficiali