Generador de favicon – favicon.ico e iconos desde imagen o texto
Crea todos los tamaños de favicon que necesita una web moderna a partir de una imagen o unas letras, además de favicon.ico, un web manifest y las etiquetas HTML para tu página.
Sube una imagen cuadrada (mínimo 512 × 512 px) o escribe 1–3 letras y elige colores. El generador crea favicon.ico (16, 32 y 48 px), iconos PNG de 16, 32, 180, 192 y 512 px, un site.webmanifest y el código HTML. Sube los archivos a la raíz de tu web y pega el código en el .
Cómo usar la herramienta: Generador de favicon
- Elige «Desde imagen» y suelta un logo cuadrado, o «Desde texto» y escribe letras.
- Para texto, elige la forma y los colores.
- Revisa la vista previa de cada tamaño.
- Descarga favicon.ico y los archivos PNG.
- Súbelos a la raíz de tu web y pega el código HTML en el <head>.
¿Qué archivos de favicon necesitas?
Navegadores, móviles y buscadores buscan archivos de icono distintos. No necesitas decenas de tamaños: este pequeño conjunto cubre prácticamente todos los dispositivos actuales.
| Archivo | Tamaño | Lo usa |
|---|---|---|
| favicon.ico | 16, 32, 48 px | Navegadores antiguos, Windows, muchos rastreadores |
| favicon-32x32.png | 32 px | Pestañas del navegador |
| apple-touch-icon.png | 180 px | Pantalla de inicio de iPhone y iPad |
| icon-192.png | 192 px | Pantalla de inicio de Android |
| icon-512.png | 512 px | Pantallas de carga, instalación PWA |
El generador crea un archivo ICO real con varios tamaños (con imágenes PNG dentro) y un site.webmanifest que apunta a los iconos de Android.
Desde una imagen o desde letras
Usa tu logo si es sencillo y se lee a tamaños diminutos. Los logos detallados se convierten en una mancha a 16 px, por eso muchas marcas usan solo la inicial o un símbolo. Sube un PNG o SVG cuadrado de al menos 512 × 512 px; las imágenes no cuadradas se centran y se completan con margen. Si solo tienes un SVG, la herramienta lo acepta, o usa antes Convertir SVG a PNG.
¿Aún no tienes logo? Elige «Desde texto», escribe de una a tres letras y elige forma y colores. Las combinaciones en negrita y con mucho contraste se leen bien en una pestaña.
Cómo instalar el favicon
- Sube todos los archivos a la carpeta raíz de tu web (la misma que tu página de inicio).
- Pega el código HTML en la sección head de cada página o de la plantilla de tu tema.
- Vacía la caché del navegador o abre la web en una ventana privada para ver el icono nuevo.
Google muestra favicons en los resultados móviles. Sus directrices piden un icono cuadrado múltiplo de 48 px; los archivos de 192 y 512 px lo cumplen. Google puede tardar días o semanas en mostrar un icono cambiado.
Consejos para un favicon nítido
Usa formas sencillas, evita líneas finas y revisa la vista de 16 px: es lo que la mayoría ve en sus pestañas. Un fondo transparente queda bien en pestañas claras pero puede desaparecer en modo oscuro, así que un cuadrado redondeado sólido suele ser más seguro. Para colores de marca que combinen, prueba el Generador de paletas de colores.
Todo se genera en tu navegador; tu logo nunca se sube.
También te pueden servir estas herramientas gratis: Convertidor de WebP a JPG, Redimensionar imagen y Comprimir imágenes.
Preguntas frecuentes
¿Qué tamaño debe tener un favicon?
Crea al menos 32 px para pestañas, 180 px para Apple y 192 y 512 px para Android. El archivo ICO debe incluir 16, 32 y 48 px.
¿Sigo necesitando favicon.ico?
Sí, es útil: navegadores antiguos, accesos directos de Windows y algunos rastreadores buscan /favicon.ico en la raíz.
¿Puedo crear un favicon con texto?
Sí. Elige Desde texto, escribe hasta tres letras y elige colores y forma.
¿Por qué no aparece mi nuevo favicon?
Los navegadores guardan los favicons en caché mucho tiempo. Vacía la caché o abre la web en una ventana privada.
¿Se sube mi logo?
No. Todos los iconos se generan en tu navegador.
Última actualización: