Generador de Favicon

Sube una imagen cuadrada y descarga todos los tamaños de favicon que necesitas, con etiquetas HTML de enlace listas para pegar.

Suelta una imagen cuadrada (PNG, JPG) o haz clic para elegirla

O genéralo a partir de texto:

Características

Todos los tamaños estándar
Código de la etiqueta link
Fragmento de manifest.json
Descarga en un archivo zip

Cómo Usar

1. Arrastra una imagen cuadrada (PNG/JPG) a la zona de subida.

2. Previsualiza todos los tamaños generados.

3. Haz clic en Descargar para obtenerlos como ZIP, y copia el fragmento HTML.

Sobre esta herramienta

Un favicon aparece en las pestañas del navegador, los marcadores, el historial, los accesos directos de la pantalla de inicio y los resultados de búsqueda, y cada lugar pide un tamaño distinto. Este generador toma una imagen cuadrada —o uno o dos caracteres sobre un fondo de color— y la dibuja a 16, 32, 48, 64, 128, 180, 192, 256 y 512 píxeles, con un botón de descarga para cada PNG. Los tamaños pequeños son donde fallan los favicons: los detalles finos y el texto delgado desaparecen a 16 × 16, así que funcionan mejor las formas contundentes y el contraste alto. Parte de una imagen cuadrada de al menos 512 × 512 píxeles para que los tamaños grandes sigan nítidos. Tras descargarlos, enlaza los archivos con etiquetas link en el head de tu página y, para aplicaciones web instalables, incluye los tamaños 192 y 512 en tu manifiesto web.

Preguntas Frecuentes

¿Qué tamaños de favicon necesito realmente?
Para la mayoría de los sitios: 32 × 32 para las pestañas del navegador (16 × 16 como respaldo heredado), 180 × 180 para los iconos táctiles de Apple, y 192 × 192 más 512 × 512 para Android y los manifiestos de aplicaciones web. 48 × 48 es un buen añadido porque la Búsqueda de Google puede mostrar favicons basados en múltiplos de 48 px.
¿Qué HTML debo añadir a mi página?
Un conjunto típico es <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">, <link rel="apple-touch-icon" href="/favicon-180x180.png"> y un manifiesto que liste los iconos de 192 y 512. Colócalos en el <head> de todas las páginas.
¿Crea un archivo .ico?
No. Exporta archivos PNG, que todos los navegadores actuales aceptan para rel="icon". Si necesitas un favicon.ico con varios tamaños para navegadores muy antiguos o algunas funciones de Windows, combina los PNG de 16, 32 y 48 con una herramienta ICO específica.
¿Por qué mi favicon se ve borroso o ilegible a 16 píxeles?
Los detalles que funcionan a 512 px se pierden a 16 px. Usa un símbolo simplificado, trazos más gruesos y un contraste fuerte, o usa la opción de texto con una sola letra en negrita, que sigue siendo legible en tamaños pequeños.
¿Por qué no aparece mi nuevo favicon?
Los navegadores guardan los favicons en caché de forma muy agresiva. Borra la caché o abre el sitio en una ventana privada, y cambia el nombre del archivo o añade un parámetro de versión como ?v=2 al reemplazarlo. Los buscadores pueden tardar días o semanas en actualizarlo.

Herramientas Relacionadas