Gratis · Senza registrazione · Funziona sul Suo server

Generi Favicon Perfette da Qualsiasi Immagine

Trasformi le Sue immagini in favicon professionali con supporto per SVG, PNG, JPG e tutti i formati principali. Scarichi un pacchetto favicon completo con tutte le dimensioni necessarie per una visualizzazione impeccabile su tutti i dispositivi e browser.

Velocissimo· Supporto SVG· Più formati

Inizi la conversione

Carichi la Sua immagine

Trascini & rilasci un'immagine oppure faccia clic per sfogliare. Generiamo tutte le dimensioni di favicon di cui ha bisogno.

Rilasci qui la Sua immagine

oppure faccia clic per sfogliare i file

Scegli file

PNGJPGGIFWEBPBMPSVGICO≤10MB

Generazione del pacchetto favicon in corso…

Spiacenti, non è stato possibile elaborare il file. Utilizzi un PNG, JPG, GIF, WebP, BMP o SVG quadrato di dimensioni inferiori a 10 MB.

Il Suo pacchetto favicon è pronto

ZIP con ICO, PNG, icona Apple touch, icone Android e manifest web.

Scarica il pacchetto favicon

Generatore di Favicon da Testo

Trasformi lettere o un breve testo in una favicon pulita. Digiti le Sue iniziali, scelga colori e forma, visualizzi l'anteprima dal vivo e scarichi il pacchetto di icone completo.

Generatore di Favicon da Emoji

Trasformi qualsiasi emoji in una favicon. Scelga un'emoji, selezioni una forma e un colore per lo sfondo, visualizzi l'anteprima dal vivo e scarichi il pacchetto di icone completo.

Editor di favicon in pixel

Disegna la tua favicon pixel per pixel su una griglia da 16×16 a 64×64. Matita, gomma e secchiello con annulla/ripeti, poi esporta un pacchetto completo ICO, PNG e Apple/Android.

Favicon Downloader

Inserisca l'URL di qualsiasi sito web per recuperare e scaricare la sua favicon nei formati PNG e ICO.

Favicon Checker

Inserisca l'URL di qualsiasi sito web per analizzarne immediatamente la configurazione delle favicon — favicon.ico, icona Apple touch, favicon SVG e manifest web. Ottenga un punteggio di integrità in pochi secondi.

Tutto il Necessario per Favicon Perfette

Un generatore di favicon professionale con tutti gli strumenti e i formati che Le servono per creare icone nitide che funzionano ovunque.

Velocissimo

Elabori le immagini in pochi secondi con un motore di conversione ottimizzato. Nessuna attesa, nessun ritardo.

Supporto SVG

Supporto completo per i file SVG con ottimizzazione e ridimensionamento puliti per risultati perfetti.

Tutti i dispositivi

Generi favicon per desktop, dispositivi mobili, tablet e PWA con tutte le dimensioni richieste.

Pacchetto completo

Scarichi tutto: ICO, file PNG, icone Apple touch e un manifest web.

Più formati

Supporto per PNG, JPG, GIF, WebP, BMP e SVG — converta da qualsiasi formato diffuso.

Pronto all'uso

Ottenga frammenti HTML e istruzioni di installazione per un'implementazione immediata.

Multi-browser

Compatibilità perfetta con Chrome, Firefox, Safari, Edge e tutti i browser moderni.

Alta qualità

L'elaborazione avanzata delle immagini mantiene le favicon nitide e chiare in ogni dimensione.

Professionale

Generi il pacchetto favicon standard del settore utilizzato dai migliori siti web al mondo.

Formati supportati

Dimensioni favicon

100%

Compatibile con i browser

Tempo di elaborazione

Guida all'Installazione Semplice

Segua questi semplici passaggi per aggiungere le Sue nuove favicon al Suo sito web.

Scarichi il pacchetto favicon

Utilizzi il generatore qui sopra per creare e scaricare il Suo pacchetto favicon completo come file ZIP.

Estragga i file

Estragga tutto il contenuto dello ZIP nella directory principale del Suo sito web (la stessa cartella di index.html).

Aggiunga il codice HTML

Copi il codice HTML riportato di seguito e lo incolli all'interno della sezione <head> delle Sue pagine.

Provi le Sue favicon

Pubblichi il Suo sito e verifichi che la favicon venga visualizzata nelle schede del browser, nei preferiti e sui dispositivi mobili.

Codice di integrazione per il Suo framework

Scelga il Suo stack e copi il codice pronto da incollare. I file si trovano nella root del sito (oppure in app/ per Next.js App Router).

index.html

<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

// app/layout.tsx
// 1. Drop these files into app/ (Next.js auto-detects them):
//    - favicon.ico, icon.png, icon.svg, apple-icon.png
// 2. For extra PNG sizes + a manifest, declare them here:
import type { Metadata } from 'next'
import './globals.css'

export const metadata: Metadata = {
  icons: {
    icon: [
      { url: '/favicon.ico', sizes: 'any' },
      { url: '/favicon-32x32.png', sizes: '32x32', type: 'image/png' },
      { url: '/favicon-16x16.png', sizes: '16x16', type: 'image/png' },
      { url: '/favicon.svg', type: 'image/svg+xml' },
    ],
    apple: ['/apple-touch-icon.png'],
  },
  manifest: '/site.webmanifest',
}

export default function RootLayout({ children }) {
  return (
    <html lang="en"><body>{children}</body></html>
  )
}

// pages/_document.tsx
import { Html, Head, Main, NextScript } from 'next/document'

export default function Document() {
  return (
    <Html>
      <Head>
        <link rel="icon" href="/favicon.ico" sizes="any" />
        <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
        <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
        <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
        <link rel="manifest" href="/site.webmanifest" />
      </Head>
      <body><Main /><NextScript /></body>
    </Html>
  )
}

// Vue (public/index.html) — put files in public/
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

// Nuxt 3 (nuxt.config.ts)
export default defineNuxtConfig({
  app: {
    head: {
      link: [
        { rel: 'icon', href: '/favicon.ico', sizes: 'any' },
        { rel: 'icon', type: 'image/png', sizes: '32x32', href: '/favicon-32x32.png' },
        { rel: 'apple-touch-icon', sizes: '180x180', href: '/apple-touch-icon.png' },
        { rel: 'manifest', href: '/site.webmanifest' },
      ],
    },
  },
})

// 1. npm i gatsby-plugin-manifest
// 2. gatsby-config.js — point icon at a 512x512 PNG
module.exports = {
  plugins: [
    {
      resolve: 'gatsby-plugin-manifest',
      options: {
        name: 'Your App Name',
        short_name: 'App',
        start_url: '/',
        display: 'standalone',
        icon: 'src/images/android-chrome-512x512.png',
      },
    },
  ],
}

// Also copy favicon.ico to the static/ folder for the browser fallback.

// src/app.html — files live in static/
<!doctype html>
<html lang="en">
  <head>
    <link rel="icon" href="/favicon.ico" sizes="any" />
    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
    <link rel="manifest" href="/site.webmanifest" />
    %sveltekit.head%
  </head>
  <body data-sveltekit-preload-data="hover">
    <div style="display:contents">%sveltekit.body%</div>
  </body>
</html>

Dove vanno i file? Rilasci favicon.ico, icon.png e apple-icon.png direttamente nella cartella app/. Next.js li rileva automaticamente — nessun bisogno di tag link manuali.

site.webmanifest

{
  "name": "Your App Name",
  "short_name": "App",
  "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"
}

File inclusi

Il Suo pacchetto favicon contiene i seguenti file.

favicon.icofavicon-16x16.pngfavicon-32x32.pngapple-touch-icon.pngandroid-chrome-192x192.pngandroid-chrome-512x512.pngfavicon.svgsite.webmanifest

Consigli degli esperti

Tenga ogni file favicon nella root del Suo sito web per la massima compatibilità.
Dopo aver aggiornato le favicon, effettui un aggiornamento forzato (oppure svuoti la cache) per vedere subito la modifica.
Provi la Sua favicon su diversi dispositivi e browser per assicurarsi che venga riprodotta correttamente.

Domande Frequenti

Risposte alle domande più comuni sulla generazione e sull'implementazione delle favicon.

Quali formati di immagine sono supportati?

Può caricare file PNG, JPG, GIF, WebP, BMP o SVG. Per un risultato più nitido, parta da un'immagine quadrata di almeno 512×512 pixel. Sono accettati file fino a 10 MB.

Quali dimensioni deve avere l'immagine originale?

Un'immagine sorgente quadrata di 512×512 o superiore è l'ideale. Il generatore la ridimensiona in modo pulito, quindi una sorgente grande e nitida restituisce le icone piccole più curate.

Supportate le favicon SVG?

Sì. I file SVG vengono mantenuti come favicon.svg vettoriale per una resa nitida sui browser moderni e vengono anche rasterizzati in tutte le dimensioni PNG e ICO per i browser più datati.

Quali dimensioni di favicon vengono generate?

Il pacchetto include PNG 16×16 e 32×32, un favicon.ico multi-risoluzione, un'icona Apple touch 180×180, icone Android/PWA 192×192 e 512×512, oltre a un manifest web.

Come aggiungo la favicon al mio sito web?

Estragga lo ZIP nella root del Suo sito e incolli il frammento HTML fornito nell'elemento <head> delle Sue pagine. Le istruzioni complete e il codice per i framework sono riportati sopra.