1. Añada una imagen
Arrastre un archivo sobre el área designada o seleccione un gráfico desde su dispositivo. Formatos admitidos: PNG, JPG, SVG. Tamaño recomendado: mín. 512×512 píxeles.
Crea favicon.ico para tu sitio web a partir de una imagen
Genere favicon.ico y un conjunto completo de iconos PNG para su sitio web a partir de una sola imagen, sin pasos de selección. Todo el procesamiento se realiza localmente en el navegador.
Loading tool editor...
Esta herramienta funciona en una pantalla más grande
Para usar esta herramienta cómodamente, ábrala en un portátil, ordenador de escritorio o tableta en modo horizontal.
Consejo
Si usa una tableta, gírela a modo horizontal: cuando el ancho de la ventana sea suficiente, la herramienta se cargará automáticamente.
PUBLICIDAD
¿Qué es un favicon y por qué debería tener uno?
Un favicon es un pequeño icono que aparece en la pestaña del navegador junto al título de la página. También lo ve en los marcadores, el historial de navegación y en la pantalla de inicio del teléfono cuando alguien añade el sitio como acceso directo.
Este pequeño gráfico cumple una función importante: ayuda a los usuarios a reconocer rápidamente un sitio entre muchas pestañas abiertas. Cuando alguien tiene una docena de pestañas abiertas en el navegador, el favicon suele ser el único elemento visible que identifica el sitio.
El generador crea un conjunto completo de iconos: un archivo favicon.ico clásico para navegadores, iconos PNG en varios tamaños y un apple-touch-icon para dispositivos Apple. También genera iconos de 192x192 y 512x512 útiles para aplicaciones web (PWA).
Cómo crear un favicon en 3 pasos
Generar un favicon tarda solo unos segundos:
2. Ajuste el fondo
Elija el color de fondo del icono o manténgalo transparente.3. Descargue los archivos
Después de generar, descargue todos los archivos con un solo clic o cada icono individualmente. Debajo de la herramienta encontrará instrucciones para añadir el favicon a su sitio.
PUBLICIDAD
¿Qué tamaños de icono genera la herramienta?
Cada tamaño tiene su uso:
favicon.ico (32×32)
Formato clásico reconocido por todos los navegadores. Se muestra en la pestaña del navegador.
PNG 16×16 y 32×32
Tamaños estándar para navegadores modernos. Se muestran en pestañas y marcadores.
PNG 180×180 (apple-touch-icon)
Icono para dispositivos Apple (iPhone, iPad). Se muestra cuando alguien añade el sitio a su pantalla de inicio.
PNG 192×192 y 512×512
Iconos para aplicaciones web (PWA), usados también en tiendas de aplicaciones.
Si no está construyendo una PWA, solo necesita: favicon.ico, PNG 32×32 y PNG 180×180. Estos tres archivos cubren la mayoría de los casos de uso.
¿Qué hace especial al generador de favicon?
Privacidad: los archivos nunca salen de su ordenador
Todas las operaciones se realizan localmente en el navegador. La imagen no se envía a ningún servidor. Al cerrar la página, todos los datos se eliminan.Conjunto completo en un solo lugar
Favicon.ico, iconos PNG, apple-touch-icon e iconos PWA: todo desde una imagen, en una herramienta.Soporte de PNG, JPG y SVG
Puede usar un logotipo en cualquier formato. Si tiene SVG, los iconos serán nítidos en todos los tamaños.Listo para sitio web y PWA
Los iconos generados de 192×192 y 512×512 puede usarlos directamente en una aplicación web (PWA). Debajo encontrará instrucciones para integrar los iconos.
PUBLICIDAD
Cómo usar el generador de favicon
Generar un favicon son unos simples pasos:
1. Añada la imagen fuente
Arrastre un archivo sobre el área designada o seleccione un gráfico desde su dispositivo. Formatos admitidos: PNG, JPG, SVG. Un logotipo simple o icono de al menos 512×512 píxeles funciona mejor.2. Configure el fondo
Elija el fondo del icono: transparente o un color concreto.3. Genere y descargue los archivos
Después de iniciar la generación, la herramienta procesa la imagen localmente: nada se envía a un servidor. Descargue todos los archivos con un solo clic o los iconos individuales por separado.
Fondo transparente (PNG/ICO)
Color de fondo:
Opción de generación: ¿qué hace?
Fondo (transparente o color)
Por defecto, el generador preserva la transparencia. También puede elegir un color de fondo específico.
PUBLICIDAD
Cómo descargar los archivos generados
Después de generar los iconos, tiene varias opciones de descarga:
Descargar todo con un clic
El botón "Descargar" guarda en el dispositivo todos los archivos generados a la vez. Esta es la opción más cómoda cuando necesita el conjunto completo de iconos.Descargar archivos individuales
Cada icono generado tiene su propio botón de descarga: puede descargar un solo archivo sin descargar el conjunto completo. útil cuando solo necesita actualizar un tamaño.
Dónde y cómo añadir un favicon
WordPress
La mayoría de los temas de WordPress tienen una opción integrada para configurar el icono del sitio. La encontrará en el panel de administración:
Apariencia → Personalizar → Identidad del sitio → Icono del sitio
Suba allí el archivo de 512×512: WordPress generará automáticamente los tamaños más pequeños. Para un control total sobre los iconos, también puede subir archivos directamente al directorio raíz mediante FTP.
PUBLICIDAD
¿Qué imagen fuente funciona mejor?
Un favicon es un gráfico muy pequeño, tan pequeño como 16×16 píxeles. No toda imagen funciona bien como fuente:
Formas simples y símbolos legibles
Los logotipos simples, letras individuales o símbolos funcionan mejor. Evite gráficos complejos con muchos detalles.Formato cuadrado
Un favicon es cuadrado. Si la imagen fuente tiene una proporción distinta de 1:1, se recortará o estirará.Tamaño suficientemente grande
Recomendamos una imagen fuente de al menos 512×512 píxeles. Las imágenes más pequeñas se ampliarán.Formato SVG como fuente ideal
SVG se escala sin pérdida de calidad, por lo que los iconos en todos los tamaños serán nítidos.Colores de alto contraste
Un favicon debe ser visible en diferentes fondos (pestañas claras, modo oscuro). Elija colores que mantengan la legibilidad.
Favicon en los resultados de búsqueda de Google
Google muestra los favicons junto a la URL del sitio en los resultados de búsqueda. Los resultados móviles muestran favicons desde 2019. Los resultados en escritorio los incluyen desde enero de 2020. El favicon es un elemento visual de marca presente en cada búsqueda de Google.
Google establece requisitos específicos para la visualización de favicons. El icono debe medir al menos 48×48 píxeles. Debe ser cuadrado. La imagen debe ser claramente visible sobre fondo blanco. Google rechaza iconos con contenido inapropiado o vacío.
El Googlebot rastrea e indexa los favicons de forma independiente al contenido de la página. La actualización del favicon en los resultados puede tardar de varios días a varias semanas. El archivo favicon no debe estar bloqueado en robots.txt - de lo contrario, Google no podrá obtener la nueva versión.
Bing también muestra favicons en sus resultados. DuckDuckGo presenta los iconos del sitio junto a cada enlace. Un conjunto completo de favicons garantiza una apariencia de marca coherente en todos los motores de búsqueda. Los usuarios reconocen los favicons conocidos más rápido, lo que contribuye a una mayor tasa de clics.
PUBLICIDAD
Favicon e identidad visual de marca en España y Latinoamérica
La coherencia visual entre el favicon y el logotipo fortalece el recuerdo de marca. El icono aparece en las pestañas del navegador, los marcadores, el historial de navegación y en la pantalla de inicio del teléfono. Cuando un usuario tiene diez o más pestañas abiertas, el favicon es el único elemento visible que identifica el sitio.
En España, PrestaShop y WooCommerce son plataformas muy extendidas que permiten configurar el favicon en los ajustes del tema. En Latinoamérica, Tiendanube y Mercado Shops facilitan la personalización visual de las tiendas en línea. Con más de 500 millones de hispanohablantes conectados a internet, un favicon reconocible diferencia la marca en mercados fragmentados.
La norma UNE 139803 de accesibilidad web en España requiere contraste suficiente para los elementos visuales de los sitios públicos. El favicon debe ser legible tanto en modo claro como en modo oscuro. Colores contrastados y formas simples cumplen este requisito de manera fiable.
Las empresas de servicios - desde despachos de abogados hasta clínicas dentales - construyen confianza desde el nivel del icono en la pestaña del navegador. La ausencia de favicon o el uso del icono predeterminado del navegador puede sugerir falta de profesionalismo.
Favicon para PWA y dispositivos móviles
Las Progressive Web Apps requieren iconos adicionales más allá del favicon estándar. El archivo manifest.json debe incluir un array de iconos con dimensiones 192×192 y 512×512 píxeles en formato PNG.
Los iconos maskable son un tipo especial de icono para dispositivos Android. El sistema operativo recorta los iconos maskable en diferentes formas - círculos, cuadrados redondeados o gotas. La zona segura cubre el 80 % interior de la superficie de la imagen. Todos los elementos gráficos esenciales deben estar dentro de esta zona para evitar ser recortados.
Apple requiere un archivo apple-touch-icon separado de 180×180 píxeles. Este archivo debe declararse en la sección head del HTML - iOS no lo lee desde el archivo manifest.
La penetración móvil en Latinoamérica supera el 70 %. Las PWA permiten experiencias similares a aplicaciones nativas sin necesidad de descarga desde tiendas. En España, bancos y servicios públicos adoptan progresivamente esta tecnología para ofrecer acceso rápido desde la pantalla de inicio.
La auditoría Lighthouse en las herramientas de desarrollo de Chrome verifica la presencia y validez del favicon y los iconos PWA. Un favicon ausente o inválido genera una advertencia en la categoría PWA de la auditoría.
PUBLICIDAD
Preguntas frecuentes sobre el generador de favicon
¿Qué tamaño debe tener la imagen fuente para generar favicons?
El tamaño recomendado es al menos 512×512 píxeles en formato cuadrado (1:1). Con esa fuente, los iconos en todos los tamaños serán nítidos y legibles. Si tiene un logotipo en formato SVG, úselo, ya que los gráficos vectoriales se escalan sin pérdida de calidad.
¿Puedo generar solo favicon.ico sin los demás iconos?
La herramienta siempre genera el conjunto completo: favicon.ico e iconos PNG 16×16, 32×32, 180×180, 192×192 y 512×512. Después de generar, puede descargar solo los archivos que necesite: cada icono tiene su propio botón de descarga.
¿Qué formatos de imagen admite el generador de favicon?
El generador acepta imágenes en formatos PNG, JPG y SVG. Como salida, genera un archivo favicon.ico e iconos PNG en todos los tamaños estándar, listos para subir a su sitio web.
¿Un favicon afecta al posicionamiento en Google?
No directamente: el favicon no es un factor de posicionamiento. Sin embargo, afecta indirectamente al reconocimiento de marca: un sitio con un icono profesional es más fácilmente identificable entre muchas pestañas abiertas, lo que puede traducirse en una mayor tasa de clics en los resultados de búsqueda.
¿Qué tamaños de icono son esenciales para un sitio web normal?
Para un sitio web típico, tres archivos son suficientes: favicon.ico (32×32), un icono PNG de 32×32 y apple-touch-icon de 180×180. Si el sitio debe funcionar como aplicación web (PWA), también necesita los iconos de 192×192 y 512×512 que genera la herramienta.
¿El favicon se muestra igual en todos los navegadores?
La mayoría de los navegadores modernos (Chrome, Firefox, Edge, Safari) reconocen el archivo favicon.ico y los iconos PNG. Pueden haber diferencias en el tamaño de icono mostrado: Chrome prefiere PNG 32×32, mientras que Safari en iOS usa apple-touch-icon 180×180. Para mejor compatibilidad, recomendamos generar el conjunto completo de tamaños.
¿Por qué el favicon no cambia después de subir un archivo nuevo?
Los navegadores almacenan en caché los favicons de forma agresiva. Después de subir un nuevo icono, intente limpiar la caché del navegador o añadir un parámetro de versión a la ruta del archivo (p. ej., /favicon.ico?v=2). El cambio puede tardar varias horas en hacerse visible.
Ayúdanos a mejorar nuestras herramientas
¿Tienes una idea para una nueva función, encontraste un error o quieres sugerir otra herramienta que facilite tu trabajo? Escríbenos – respondemos en 24 horas.
PUBLICIDAD
Explore otras herramientas
JPG a WebP
Convierte fotos JPG a WebP ligero. Reduce el peso de las imágenes hasta un 35%.
Editor de imágenes en línea
Cambie el tamaño, recorte y convierta su imagen. Formatos listos para redes sociales, avatares circulares, exportación a JPG/PNG/WebP.
Verificador de meta título y descripción
Compruebe la longitud del título y la descripción en píxeles. Vista previa de Google en vivo y sugerencias de optimización.
PNG a JPG
Convierte archivos PNG a JPG en el navegador. Sin límite de archivos, sin registro.
Generador de favicon
Cree un conjunto completo de favicon.ico para su sitio web desde una imagen. Todos los tamaños necesarios, sin registro.
Generador de paletas de colores
Genere 9 paletas a partir de un color: monocromática, complementaria, triádica y más. Códigos HEX.
WebP a JPG
Convierte archivos WebP a JPG compatible con cualquier programa y plataforma.
Comprobador de contraste de colores
Compruebe el contraste de texto y fondo según WCAG 2.1 AA y AAA. Corrección automática de colores.
Generador de códigos QR gratuito
Cree un código QR para sitio web, tarjeta vCard o impresión. Exporte PNG y SVG, sin registro.
Contador de palabras y caracteres
Cuente palabras, caracteres, oraciones y tiempo de lectura. Compruebe la legibilidad con la puntuación Flesch-Kincaid.