Sobre Generador de tamaños de favicon
El generador de tamaños de favicon de Zyff crea todos los tamaños de una vez a partir de una sola imagen: las imágenes clásicas de 16, 24, 32, 48, 64, 128 y 256 px dentro de un único favicon.ico, PNG sueltos de 16, 32, 48, 64, 96, 128, 144, 192, 256 y 512, los iconos apple-touch de 120, 152, 167 y 180, los tamaños de Android y PWA de 48 hasta 512, un icono enmascarable, el manifiesto web que los referencia y el XML de mosaico de Windows. Todo llega con el fragmento del head ya escrito, y puedes descargar el conjunto entero en un zip. La generación corre en los servidores de Zyff desde un maestro de 1024 px, solo en memoria, así que lo que subes nunca se guarda.
Cómo generar todos los tamaños de favicon
Sube una imagen maestra
Suelta la versión cuadrada más grande que tengas. Un origen de 512 px es el mínimo práctico y 1024 px o un vector es mejor: todos los tamaños de abajo se reducen a partir de un único render maestro en vez de remuestrearse unos de otros, y eso es lo que mantiene legible la versión de 16 px.
Revisa la selección de tamaños
Esta página arranca con todos los tamaños marcados. Desmarca los que sepas que no necesitas — el de 128 y el de 384 se piden pocas veces — o déjalos todos y que el zip se lleve el lote.
Mira la vista previa de 16 px
El icono más pequeño es el que decide si el conjunto funciona. El detalle que se lee a 512 px se convierte en barro a 16, y este es el momento de simplificar el original y no después de haber pegado las etiquetas.
Descarga el zip
Un solo archivo comprimido con todos los ficheros en las rutas que referencia el fragmento generado, para que el HTML funcione en cuanto los archivos estén en su sitio.
Pega el fragmento del head
Copia las etiquetas link generadas en tu <head>. Cada una lleva un atributo sizes explícito, que es lo que le permite a un navegador o a un rastreador elegir el archivo correcto en vez de adivinar.
Qué hace Generador de tamaños de favicon
Todos los tamaños en una pasada
ICO de 16 a 256, PNG de 16 a 512, apple-touch en cuatro tamaños, Android y PWA de 48 a 512, además de un icono enmascarable. Sin una segunda subida y sin volver a generar cada tamaño.
Un maestro y luego reducciones
El origen se genera una vez a 1024 px y todos los elementos se reducen a partir de ahí. Encadenar reducciones — de 512 a 256 a 128 — acumula error de remuestreo, y eso se nota primero a 16 px.
Atributos sizes escritos por ti
Cada etiqueta link declara su propio valor de sizes. Google elige el favicon que muestra junto a un resultado de entre los iconos rastreables cuyo tamaño es múltiplo de 48, y solo puede saberlo por ese atributo.
Manifiesto y XML de mosaico incluidos
El manifiesto web que referencia los tamaños de Android y el XML de browserconfig para los mosaicos antiguos de Windows se generan junto a las imágenes, apuntando a las mismas rutas.
Descarga en zip
Todo el conjunto en un único archivo comprimido, ordenado para que encaje con el fragmento, así que no hay nada que renombrar.
At a glance
| Tamaños ICO disponibles | 16, 24, 32, 48, 64, 128 y 256 px, en un único archivo con varias imágenes |
|---|---|
| Tamaños PNG disponibles | 16, 32, 48, 64, 96, 128, 144, 192, 256 y 512 px |
| Tamaños apple-touch | 120, 152, 167 y 180 px (el de 180 es el único que necesita el iOS actual) |
| Tamaños de Android y PWA | 48, 72, 96, 144, 192, 256, 384 y 512 px, más un enmascarable de 512 px |
| Render maestro | 1024 px, con todos los elementos reducidos a partir de él |
| Entrada | PNG, JPG, WebP, AVIF o SVG de hasta 25 MB y 100 megapíxeles |
| Archivos de texto generados | site.webmanifest y browserconfig.xml |
Frequently asked questions
¿Qué tamaños de favicon necesito de verdad en 2026?
Un mínimo práctico es un PNG de 32 px, un apple-touch-icon de 180 px, uno de 192 px y otro de 512 px para Android y el manifiesto, y un favicon.ico con 16 y 32 para lo antiguo. Añade el de 48 si te importa el icono que muestra Google junto a tu resultado de búsqueda, porque solo tiene en cuenta iconos cuyo tamaño sea múltiplo de 48. El resto de la matriz es un seguro y no un requisito.
¿Por qué Google quiere un favicon de un tamaño múltiplo de 48?
La documentación de Google dice que elige un icono cuyas medidas sean múltiplo de 48 px, y lee el tamaño del atributo sizes de tu etiqueta link en vez de descargar todos los candidatos. Una web que solo publica iconos de 16 y 32 px no tiene ningún archivo elegible, y por eso un favicon puede verse perfectamente en la pestaña del navegador y aun así faltar en el resultado de búsqueda.
¿Qué tamaño pide cada navegador o sistema operativo?
Los navegadores de escritorio cogen el PNG más pequeño que les sirva para la pestaña, normalmente el de 16 o el de 32. iOS usa apple-touch-icon a 180 y lo reduce para dispositivos más pequeños. Android y las PWA instaladas leen el manifiesto y cogen el de 192 para el lanzador y el de 512 para la pantalla de inicio. Los mosaicos anclados de Windows leen browserconfig.xml. El .ico es el respaldo que probará cualquier cosa no listada.
¿Un favicon más grande es siempre mejor?
No, y aquí es donde se tuercen casi todos los juegos de iconos. Un icono de 512 px reducido a 16 px por el navegador se ve peor que un archivo de 16 px dibujado a propósito, porque la reducción del navegador es rápida y no cuidadosa. Publicar los tamaños pequeños como archivos de verdad es toda la razón de que exista la matriz en vez de un único PNG grande.
¿Tengo que usar todos los archivos del zip?
No. Publica lo que tu web necesite y borra el resto: un PNG de 384 px sin usar no cuesta nada más que desorden. Lo que importa es que todos los archivos que referencia el fragmento del head existan de verdad en la ruta que nombran; una etiqueta link que apunta a un icono que falta es peor que ninguna etiqueta.
¿Dónde van los archivos?
La raíz del sitio es el lugar convencional y el que da por hecho el fragmento predeterminado, porque /favicon.ico se pide desde la raíz lo declares o no. Si sirves los iconos desde un subdirectorio, fija la ruta base antes de copiar el fragmento para que todos los href coincidan.