Guía de Tamaños de Favicon - Especificaciones Completas para 2025

Guía completa de tamaños de favicon: 16×16, 32×32, 180×180, 192×192, 512×512. Aprende qué tamaños necesitas para pestañas del navegador, iOS, Android y Windows.

Los tamaños de favicon pueden sentirse abrumadores—hay docenas de tamaños posibles, y cada plataforma parece querer algo diferente. La buena noticia? No necesitas todos. La mayoría de los sitios modernos usan solo 5-7 tamaños principales que cubren el 99% de los casos de uso.

Esta guía te muestra exactamente qué tamaños de favicon necesitas en 2025, para qué se usa cada tamaño, y cómo exportarlos desde nuestro Convertidor de Imágenes sin perder tiempo en tamaños obsoletos.

Cómo eligen los navegadores los tamaños de favicon

Cuando un navegador necesita un favicon, mira todos los tamaños que has proporcionado y elige el más cercano a lo que necesita. Si proporcionas un icono de 32×32 pero el navegador quiere 16×16, escalará la versión de 32×32. Esto funciona, pero no es ideal—el escalado puede hacer que los iconos se vean borrosos.

Por eso deberías proporcionar múltiples tamaños. Pero no necesitas cada tamaño desde 16×16 hasta 512×512. Un conjunto pequeño y bien elegido (5-7 tamaños) cubre pestañas de escritorio, pantallas de inicio móviles y pantallas de alta densidad de píxeles sin inflar tu sitio.

Los favicons SVG son geniales porque escalan perfectamente a cualquier tamaño. Pero no todas las plataformas soportan SVG aún (te estamos mirando, iOS), así que aún necesitarás respaldos PNG para máxima compatibilidad.

Los 7 tamaños de favicon que realmente necesitas

16×16 y 32×32 - Estos son los tamaños clásicos de pestaña del navegador. 16×16 aparece en pestañas del navegador en pantallas estándar, mientras que 32×32 se usa en pantallas de alta densidad de píxeles (pantallas Retina). Cada paquete de favicon debería incluir estos dos.

48×48 - Usado por Windows para accesos directos de escritorio y la barra de tareas. Si no apuntas a usuarios de Windows, puedes omitir este, pero es lo suficientemente pequeño que incluirlo no hace daño.

180×180 - Este es el tamaño de Apple Touch Icon para iOS e iPadOS. Cuando los usuarios añaden tu sitio a su pantalla de inicio en iPhone o iPad, iOS usa este tamaño. Es innegociable si tienes usuarios móviles.

Requisitos específicos de plataforma

iOS e iPadOS: Los Apple Touch Icons (<link rel="apple-touch-icon">) deben ser de al menos 180×180 píxeles. iOS ignora tamaños más pequeños y no usará tu favicon regular para accesos directos de pantalla de inicio. Asegúrate de que tu icono de 180×180 tenga algo de padding alrededor del logo—iOS añade esquinas redondeadas automáticamente.

Android y Chrome: Estas plataformas usan iconos de tu archivo manifest.json. Necesitas 192×192 para accesos directos de pantalla de inicio y 512×512 para pantallas de splash y el cajón de aplicaciones. Si estás construyendo una PWA, estos tamaños son requeridos para que el prompt "Añadir a pantalla de inicio" funcione.

Windows: Los accesos directos de escritorio e iconos de la barra de tareas usan 48×48 y a veces referencian archivos .ico que agrupan múltiples tamaños (16×16, 32×32, 48×48) en un archivo. Nuestro Convertidor de Imágenes genera un archivo favicon.ico automáticamente, así que no necesitas preocuparte por esto.

Consejos para exportar tamaños de favicon

Empieza con un archivo fuente de alta resolución (al menos 512×512, idealmente 1024×1024 o vector). Esto te permite exportar todos los tamaños más pequeños sin perder calidad. Si empiezas con una fuente de 32×32 e intentas escalar a 512×512, se verá pixelado.

Mantén tu diseño simple en tamaños pequeños. Los detalles que se ven geniales a 512×512 desaparecerán a 16×16. Prueba tu favicon a 16×16 antes de exportar—si no puedes reconocerlo, simplifica el diseño. Evita líneas delgadas, texto pequeño y gradientes complejos.

Usa nuestro Convertidor de Imágenes para generar todos los tamaños automáticamente. Sube tu logo (PNG, JPG o SVG), y exportaremos todos los 7 tamaños principales más el código HTML que necesitas. No pierdas tiempo redimensionando imágenes manualmente en Photoshop—deja que la herramienta lo maneje.

¿Listo para crear tus favicons?

Ahora que sabes qué tamaños necesitas, usa nuestro Convertidor de Imágenes para generar tu paquete completo de favicon. Sube tu logo, descarga el archivo ZIP, y obtendrás todos los 7 tamaños más el código HTML para instalarlos.