Herramientas · Imagen · Generador de favicon
Generador de favicon
Convierte una imagen en un conjunto completo de favicons: un .ico multitamaño, PNG independientes y un manifiesto web, además del código HTML para pegar, todo en tu navegador.
Añade un archivo y ejecuta la herramienta.
Tu archivo está listo.
Prueba otro archivo, o inténtalo de nuevo.
Ajustes
Elige un archivo, ajusta la configuración y ejecuta la herramienta.
Funciona por completo en tu navegador. No se sube ningún archivo.
Cómo funciona
Suelta o elige tu imagen de origen (JPG, PNG, WebP, GIF o BMP, hasta 25 MB).
Elige un color de fondo para los iconos que no pueden quedar transparentes, como el icono de Apple touch.
Descarga el zip y pega el fragmento HTML en el <head> de tu sitio.
Preguntas frecuentes
Siete archivos: un favicon.ico multitamaño (16, 32 y 48px en un solo contenedor), cinco PNG independientes en 16, 32, 180, 192 y 512px, y un site.webmanifest que referencia las dos imágenes más grandes.
Cubre el mismo conjunto esencial - .ico, tamaños PNG, icono de Apple touch y manifiesto web - sin subir tu imagen a ningún sitio. Omite los formatos de mosaico de Windows y la pestaña anclada de Safari, que casi ningún sitio actual necesita.
Cada tamaño se recorta a un cuadrado, centrado en la imagen, sin estirarla ni deformarla nunca.
No. Cada cambio de tamaño y la creación del zip ocurren en tu navegador. La imagen nunca sale de tu dispositivo.
Guías
Una mirada más de cerca a problemas concretos que resuelve esta herramienta.
Why Your Favicon Looks Blank or Cropped on Some Devices
A missing favicon doesn't throw an error - it just shows up blank on a phone home screen or in a browser tab, in exactly the places you're least likely to check yourself.
Leer la guíaHow to Generate a Complete Favicon Set From One Logo
Drop one image in and get seven files back: a multi-size .ico, five PNGs, and a manifest, plus the HTML to paste. Here is the whole process, step by step.
Leer la guíaFavicons for a PWA: Do You Actually Need the Manifest Too
A favicon and an installable-app icon are read from two different places. Here is what the generated site.webmanifest actually does, and when you can skip it.
Leer la guía
Comentarios