Favicon
Generator
Upload any image and generate favicons in all standard sizes. Download individually or grab them all as a ZIP.
Drop your image here or click to browse
PNG, JPG, WebP, or SVG
How It Works
Upload
Drop any PNG, JPG, WebP, or SVG image to use as your favicon source.
Generate
All standard favicon sizes are generated instantly using the Canvas API.
Download
Grab individual sizes or download everything as a ready-to-use ZIP.
Genera un paquete de favicons online a partir de una sola imagen de origen, listo para añadir a cualquier sitio o web app. El generador de favicons de ConverterUp produce todos los tamaños estándar de 16x16 a 512x512, incluyendo iconos para Apple touch, iconos de pantalla de inicio en Android y un fragmento de manifiesto que puedes pegar en tu HTML. Diseñadores y desarrolladores ahorran tiempo al evitar varias exportaciones manuales en editores de imagen. La conversión se ejecuta en el navegador, así que logotipos inéditos y activos de marca quedan privados y nunca se almacenan en un servidor remoto.
Por qué los favicons siguen importando en 2026
Un favicon es el pequeño anclaje visual que distingue tu sitio en las pestañas del navegador, los marcadores, el historial y los menús de pestañas desbordadas. Con usuarios que mantienen rutinariamente más de 30 pestañas abiertas, el favicon es a menudo la única parte visible de tu marca durante horas seguidas. Un favicon ausente o genérico es una señal pequeña pero constante de que el sitio es aficionado.
Más allá de las pestañas del navegador, los favicons definen el icono en la pantalla de inicio de iOS y Android cuando se usa 'Añadir a la pantalla de inicio', la baldosa en los anclajes del menú Inicio de Windows, el icono en el Dock de macOS cuando se instala una PWA, y el avatar en resultados de búsqueda que algunos navegadores (Chrome, DuckDuckGo) muestran junto a los enlaces orgánicos.
En las PWAs, los iconos del manifiesto son imprescindibles: sin iconos de 192 × 192 y 512 × 512 declarados en manifest.json, el navegador no muestra el prompt de instalación y Lighthouse suspende la auditoría de instalabilidad.
Un paquete de favicons coherente también transmite atención al detalle a las personas que más cuentan para una primera impresión: reclutadores que abren tu portfolio, clientes que aterrizan desde un anuncio de Google, periodistas que verifican una fuente. El coste marginal (una imagen de origen, una subida) tiende a cero; el coste de no hacerlo es un 404 en la pestaña de red y un globo terráqueo genérico en la pestaña.
ToolSeo.favicon-generator.section1.p5
Tamaños necesarios para navegadores y sistemas modernos
16 × 16 y 32 × 32: los favicons clásicos de pestaña. 32 es el valor por defecto moderno; 16 es el respaldo para DPI heredados. Ambos se incluyen dentro de un favicon.ico multirresolución.
180 × 180: Apple Touch Icon, usado por Safari de iOS para los accesos directos en la pantalla de inicio. Apple ya no necesita tamaños separados por dispositivo desde iOS 11; 180 es el único que hay que enviar.
192 × 192 y 512 × 512: iconos de pantalla de inicio de Android y de instalación de PWA, declarados en el manifiesto de la web app. El 512 también sirve como icono de splash en Android y como origen de alta DPI para PWAs de escritorio.
Variantes maskable: los iconos adaptables de Android se recortan a círculo o squircle. Proporciona un icono con purpose: maskable y un área segura generosa (mantén el logotipo dentro del 80 % central del lienzo) para que el sistema no recorte el grafismo de marca.
ToolSeo.favicon-generator.section2.p5
Instalación HTML: link, manifiesto y theme color
Coloca los archivos generados en la raíz de tu sitio y pega lo siguiente en <head>: <link rel="icon" href="/favicon.ico" sizes="32x32">, <link rel="icon" href="/icon.svg" type="image/svg+xml">, <link rel="apple-touch-icon" href="/apple-touch-icon.png"> y <link rel="manifest" href="/manifest.webmanifest">.
El archivo manifest.webmanifest une todo el paquete para las PWAs: declara name, short_name, start_url, display: "standalone", background_color, theme_color y el array de iconos con las entradas de 192 y 512.
Añade <meta name="theme-color" content="#2DD4BF"> para definir el color del chrome del navegador en Chrome de Android y en versiones recientes de Safari. Proporciona variantes con media="(prefers-color-scheme: dark)" si tu sitio tiene modo oscuro, para que el tinte de la barra coincida con ambos esquemas.
ToolSeo.favicon-generator.section3.p4
ToolSeo.favicon-generator.section3.p5
ToolSeo.favicon-generator.section4.heading
ToolSeo.favicon-generator.section4.p1
ToolSeo.favicon-generator.section4.p2
ToolSeo.favicon-generator.section4.p3
ToolSeo.favicon-generator.section4.p4
ToolSeo.favicon-generator.section4.p5
ToolSeo.favicon-generator.section5.heading
ToolSeo.favicon-generator.section5.p1
ToolSeo.favicon-generator.section5.p2
ToolSeo.favicon-generator.section5.p3
ToolSeo.favicon-generator.section5.p4
ToolSeo.favicon-generator.section5.p5
Preguntas frecuentes
¿Qué tamaños incluye el paquete de favicons?
El ZIP contiene iconos PNG de 16x16, 32x32, 48x48, 96x96, 144x144, 152x152, 180x180, 192x192, 256x256, 384x384 y 512x512, además de un favicon.ico multirresolución para navegadores antiguos.
¿Cuál es el tamaño recomendado de la imagen de origen?
Usa una imagen cuadrada de al menos 512x512 píxeles, idealmente PNG o SVG con fondo transparente. Las imágenes más pequeñas se pueden ampliar pero quedarán borrosas en los tamaños mayores.
¿Se admiten archivos SVG como origen?
Sí. Sube un SVG y el generador lo rasteriza en cada tamaño objetivo para resultados nítidos sin artefactos de antialiasing. También se aceptan PNG y JPG.
¿Cómo instalo el favicon en mi sitio?
Extrae el ZIP, copia los archivos a la raíz o carpeta de assets de tu sitio y pega las etiquetas link en el head del HTML. El archivo de manifiesto incluido permite la instalación como Progressive Web App.
¿Por qué mi favicon no se actualiza después de reemplazarlo?
Los navegadores cachean los favicons de forma agresiva, a veces durante semanas, al margen de la caché normal. Fuerza la recarga versionando la URL (<code>/favicon.ico?v=2</code>), sirviendo el archivo con un <code>Cache-Control</code> con max-age corto, o vaciando la caché del favicon (en Chrome DevTools: Application → Storage → Clear site data).
¿Sigo necesitando favicon.ico si proporciono iconos PNG?
Sí, por dos motivos: los navegadores antiguos y muchos bots buscan <code>/favicon.ico</code> en la raíz por convención, y algunas plataformas (lectores RSS, previsualizadores de enlaces, herramientas de intranet) solo comprueban la ruta ICO. El coste es bajo: un ICO multirresolución de 4-8 KB cubre todos los clientes heredados.
ToolSeo.favicon-generator.q7
ToolSeo.favicon-generator.a7
ToolSeo.favicon-generator.q8
ToolSeo.favicon-generator.a8