Gratis · 100% privado · Sin instalar nada
Generador de favicons para tu web
Sube tu logo una vez y descarga todos los tamaños que necesita tu sitio, listos para usar, junto con el código para pegar en tu HTML.
Código para pegar en tu <head>
🔒 100% privado — tu logo se procesa en tu dispositivo y no se sube a ningún servidor.
Genera PNG en los tamaños estándar. Si necesitas también un .ico clásico, la mayoría de navegadores actuales ya aceptan PNG sin problema.
Cómo funciona
1. Sube tu logo
Cuanto más cuadrado y grande, mejor calidad en todos los tamaños.
2. Generamos todos los tamaños
16, 32, 48, 180, 192 y 512 píxeles, automáticamente.
3. Descarga y pega el código
Un .zip con las imágenes y el HTML exacto que necesitas.
Por qué tu web necesita varios tamaños de favicon
El pequeño ícono que aparece en la pestaña del navegador se llama favicon, pero hoy en día una web necesita más que un solo archivo: los navegadores de escritorio piden tamaños pequeños (16 y 32 píxeles), los iPhone usan un ícono de 180 píxeles cuando guardas la web en pantalla de inicio, y Android y las aplicaciones web progresivas piden 192 y 512 píxeles. Si falta alguno, ese dispositivo mostrará un ícono genérico o pixelado — un detalle pequeño, pero que transmite descuido en un negocio o proyecto que quiere verse profesional.
Para qué sirve exactamente cada tamaño
| Tamaño | Dónde se usa |
|---|---|
| 16×16 px | Pestaña del navegador en escritorio |
| 32×32 px | Pestaña en pantallas de alta resolución, marcadores/favoritos |
| 48×48 px | Accesos directos de Windows |
| 180×180 px | Ícono al guardar la web en pantalla de inicio de iPhone/iPad |
| 192×192 px | Android, ícono de app cuando se guarda la web |
| 512×512 px | Pantalla de carga de apps web progresivas (PWA) |
Cómo diseñar un buen favicon
Un favicon se ve a un tamaño diminuto, así que los detalles finos y el texto pequeño simplemente desaparecen. Las marcas que mejor funcionan como favicon son formas simples y reconocibles: una letra inicial con buen contraste, un ícono geométrico, o un elemento distintivo del logo aislado (no el logo completo con texto). Evita degradados sutiles y sombras — a 16 píxeles se ven como una mancha borrosa. Si tu logo tiene texto, usa solo el símbolo o la inicial para el favicon.
Errores comunes
Usar solo un tamaño para todo. Un favicon de 512×512 escalado por el navegador a 16 píxeles se ve peor que uno diseñado específicamente en ese tamaño — por eso PixSwap genera cada tamaño por separado, recortando el centro de tu imagen.
Olvidar el manifest.json en proyectos con PWA. Si tu web funciona como aplicación instalable, sin ese archivo el ícono de 192 y 512 píxeles no se usará correctamente. Por eso el .zip que descargas incluye un site.webmanifest ya configurado.
PixSwap genera automáticamente los 6 tamaños más usados a partir de una sola imagen, y te da el código HTML exacto para pegar en tu sitio.
Preguntas frecuentes
¿Qué tamaños de favicon necesito?
Como mínimo 16x16 y 32x32 para el navegador, 180x180 para iPhone/iPad, y 192x192 y 512x512 para Android y PWAs.
¿Qué imagen debo subir?
Idealmente un logo cuadrado y simple, de al menos 512x512 píxeles, con buen contraste.
¿Por qué mi favicon se ve borroso en algunos dispositivos?
Probablemente solo tienes un tamaño y el navegador lo está escalando. Cada tamaño (16, 32, 180, 192, 512 px) debe generarse por separado para verse nítido en cada contexto — que es justo lo que hace esta herramienta.
¿Necesito el archivo .ico clásico?
Ya casi no. Los navegadores modernos aceptan PNG sin problema, y el código que genera esta herramienta usa PNG en todos los tamaños. El .ico solo era imprescindible para navegadores muy antiguos.