Generador de favicon gratis
Convierte cualquier imagen en favicones de varios tamaños con fragmentos HTML y un manifiesto.
Cargando herramienta…
Cómo generar favicon PNGs y un manifiesto web
Crea varios tamaños de favicon a partir de una imagen cuadrada. Descarga PNGs y usa el HTML generado y el manifiesto opcional en tu sitio.
- Elige un logotipo o icono cuadrado.
- Inspecciona las previsualizaciones de tamaño pequeño.
- Descarga PNGs y opcionalmente el manifiesto.
- Copia el fragmento HTML y ajusta las rutas a tus archivos publicados.
¿Quién necesita un set de favicones?
Un favicon es el pequeño icono en las pestañas del navegador, marcadores y listas de historia. Los teléfonos también usan una versión más grande cuando alguien guarda un sitio en la pantalla de inicio. Un sitio sin uno parece inacabado, y uno borroso parece descuidado.
Este generador se adapta a un nuevo blog o cartera, un sitio de pequeñas empresas que se mueve a tu propio dominio, o una aplicación web que necesita iconos para un manifiesto. Subes una imagen y recibes diez tamaños de PNG, un fragmento HTML y un manifiesto básico.
Ejemplo trabajado con un logotipo de 1024 por 1024
Cargar un logotipo cuadrado que sea de 1024 por 1024 píxeles. La herramienta crea inmediatamente archivos PNG a 16, 32, 48, 64, 96, 128, 180, 192, 256 y 512 píxeles cuadrados, llamados favicon-16.png a favicon-512.png. Cada tamaño tiene tu propia vista previa y enlace de descarga, o puede utilizar Descargar todos los PNGs.
El fragmento HTML contiene una línea de enlace rel=icon para cada uno de los diez tamaños y una línea de Apple-touch-icon para la imagen 180 por 180. El manifiesto contiene dos iconos, 192 por 192 y 512 por 512, que son los tamaños que buscan la mayoría de las instrucciones de instalación.
El fragmento y el manifiesto contienen los datos de la imagen incrustados en línea. Antes de publicar, reemplace cada valor href o src con la ruta al archivo que subió, como /favicon-32.png.
Cómo se fabrican y utilizan los tamaños
Cada tamaño se dibuja de tu imagen original en un lienzo cuadrado con alisado de alta calidad y guardado como PNG, que mantiene la transparencia. Debido a que cada archivo se extrae directamente de la fuente, los tamaños pequeños no son copias de otras copias ya reducidas.
Los navegadores eligen el tamaño más cercano para el trabajo. Las pestañas de las pantallas estándar a menudo usan 16 o 32 píxeles, las pantallas de alta densidad pueden usar 48 o 64, las pantallas de inicio iOS usan el icono de Apple de 180 píxeles, y Android o aplicaciones web instaladas usan 192 y 512 del manifiesto. El manifiesto de esta herramienta contiene sólo la lista de iconos, por lo que añadir campos como nombre y tema_color si los desea.
Errores comunes a evitar
No cargue una imagen ancha o alta. Cada tamaño se dibuja como un cuadrado, por lo que un logotipo rectangular será aplastado. Recortarlo a un cuadrado primero.
Evita texto fino y líneas delgadas. A 16 por 16 píxeles un nombre completo de la compañía se convierte en una mancha, por lo que uses un símbolo o una letra en negrita. También comprueba el icono en los temas del navegador de luz y oscuridad, ya que un logotipo oscuro en un fondo transparente puede desaparecer en modo oscuro.
Consejos útiles y limitaciones
- Usa formas simples y buen contraste para los iconos pequeños.
- Las descargas de imágenes generadas son PNGs, no un paquete ICO multiimagen.
- Comienza desde una imagen al menos 512 por 512 píxeles para que el icono más grande se mantenga nítido.
- Mira de cerca las vistas previas de 16 y 32 píxeles, porque esos son los tamaños que la mayoría de los visitantes realmente ven.
Preguntas frecuentes
¿Esto instala mi favicon?
No. Publique los archivos y agrega el marcado de cabeza en tu sitio.
¿Por qué el viejo favicon sigue siendo visible?
Navegadores cache favicons. Comprueba la ruta publicada y prueba una sesión nueva o renovada.
¿Siempre es necesario el manifiesto?
No. Los enlaces comunes de favicon funcionan por separado; el manifiesto proporciona metadatos opcionales estilo app.
¿Qué tamaños crea el generador?
Crea iconos PNG en 16, 32, 48, 64, 96, 128, 180, 192, 256 y 512 píxeles cuadrados.
¿Se recortará automáticamente una imagen rectangular?
No. La imagen se redimensiona a un cuadrado sin recortar, por lo que una imagen rectangular se verá estirada. Recortarlo a un cuadrado antes de subirlo.
¿Qué incluye el archivo de manifiesto?
Enumera los iconos de 192 y 512 píxeles. Puedes añadir otros campos, como el nombre de la aplicación y el color del tema, editando el archivo.
Su entrada se procesa en tu navegador sin una cuenta ToolWorld Online. Copia o descarga cualquier cosa que quieras guardar antes de salir de la página.
Lee nuestra política de privacidad · Acerca de ToolWorld Online