Nouplo

Generador de favicon

Entra una imagen; salen favicon.ico, apple-touch-icon, iconos del manifiesto y las etiquetas para pegar.

Arrastra tus archivos aquí

o haz clic para elegirlos desde tu dispositivoFormatos admitidos: JPG, JPEG, PNG, WEBP, AVIF, GIF, BMP, HEIC, HEIF, SVG

Hasta 3 archivos por operaciónHasta 20 MB por archivo10 operaciones al díaQuita los límites con Pro✓ Funciona sin conexión

Tus archivos se quedan en tu dispositivo

Esta herramienta se ejecuta por completo en tu navegador. No se sube nada, no se guarda nada, e incluso puedes desconectarte de internet antes de empezar.

Cómo funciona

  1. Añade tu logo: mejor un SVG cuadrado; si no, un PNG o JPG de al menos 512 × 512 px.
  2. Elige cómo se coloca en el cuadrado —la imagen completa con un margen opcional, o rellenando el cuadrado—, además de la forma y el fondo.
  3. Pulsa «Crear favicons» y descárgalo todo junto en un ZIP.
  4. Pon los archivos en la raíz de tu web y pega las etiquetas de favicon-tags.html en el <head> de tus páginas.

Preguntas frecuentes

¿Qué archivos obtengo y para qué sirve cada uno?
favicon.ico reúne 16, 32 y 48 px en un solo archivo, para los navegadores y rastreadores que piden /favicon.ico directamente. favicon-96x96.png es para los resultados de búsqueda, donde Google quiere un múltiplo de 48 px. apple-touch-icon.png (180 px) es el icono de la pantalla de inicio del iPhone y el iPad. Los dos PNG web-app-manifest y site.webmanifest son para Android y las aplicaciones web instaladas. Si partes de un SVG, obtienes además favicon.svg, y favicon-tags.html contiene las líneas para el <head>.
Elegí fondo transparente. ¿Por qué el apple-touch-icon no lo es?
Porque iOS no muestra transparencia en la pantalla de inicio: rellena de negro los píxeles transparentes y redondea las esquinas por su cuenta. Por eso ese archivo es siempre un cuadrado lleno y opaco, con el fondo que elegiste o en blanco. Los demás iconos conservan la transparencia.
¿Mejor partir de un SVG o de un PNG?
De un SVG, si lo tienes. Así cada tamaño se dibuja desde el vector: el icono de 16 px se dibuja a 16 px en lugar de reducirse desde una imagen grande, y además obtienes favicon.svg, que prefieren los navegadores modernos. Con PNG o JPG, usa uno de al menos 512 × 512 px; un logo muy detallado no sobrevive a 16 px en ningún caso, y para eso están el margen y un símbolo más sencillo.
¿Por qué Google muestra un globo en lugar de mi icono?
Google tiene que poder rastrear el icono y la página de inicio que lo enlaza, y el icono debe ser cuadrado y con un lado múltiplo de 48 px; el archivo de 96 px de aquí está hecho para eso. Una vez publicados los archivos, los resultados de búsqueda pueden tardar días o semanas en reflejar el cambio.
¿Se sube mi logo?
No. Cada archivo se dibuja en esta página con el canvas de tu navegador, y el ZIP también se arma aquí. No se envía nada a ningún servidor.

Herramientas relacionadas