# Generador de favicon
https://rankproof.eu/es/tools/seo-favicon-generator
## Respuesta breve
Crea favicon.ico, el icono táctil de Apple y los iconos de la web app, además de las etiquetas HTML, a partir de una imagen.
## Qué hace
Crea un conjunto de favicons a partir de una imagen: favicon.ico con iconos de 16, 32 y 48 px, un icono táctil de Apple de 180 px, iconos de 192 y 512 px para el manifiesto de la web app, un icono maskable de 512 px y las etiquetas HTML que debes añadir a tus páginas. Un SVG subido también se incluye como icon.svg.
## Cómo funciona
1. Elige una imagen cuadrada, lo ideal es un SVG o un PNG de al menos 512×512 px
2. Elige un color de fondo para el icono táctil de Apple y el icono maskable
3. Tu navegador dibuja cada tamaño y empaqueta los más pequeños en favicon.ico
4. Descarga los archivos, copia las etiquetas HTML y prueba el resultado con el comprobador de favicon
## Ejemplo de entrada y salida
ENTRADA
```text
imagen: logo.svg
fondo: #ffffff
```
SALIDA
```text
favicon.ico 16, 32, 48 px
apple-touch-icon.png 180 px
icon-192.png 192 px
icon-512.png 512 px
icon-512-maskable.png 512 px
icon.svg SVG original
manifest.webmanifest iconos del manifiesto
```
## Por qué importa
Los navegadores muestran el favicon en las pestañas y los marcadores, los móviles usan el icono táctil en la pantalla de inicio, y Google Search puede mostrar el favicon junto a tus páginas en los resultados. Google solo lo muestra cuando el icono es cuadrado, mide al menos 8×8 px (se recomienda más de 48×48 px) y es rastreable, junto con la página de inicio.
## Quién lo usa
- **Dueño de un pequeño negocio**: Convertir un logo en todos los archivos de iconos que necesita un sitio web nuevo.
- **Desarrollador web**: Generar el conjunto de iconos y los iconos del manifiesto para una web app progresiva.
- **Diseñador**: Ver cómo se ve un logo a 16 px antes de entregarlo.
## Preguntas frecuentes
### ¿Qué archivos necesito?
La mayoría de los sitios usan favicon.ico, un icono táctil de Apple, y iconos de 192 y 512 px para el manifiesto de la web app. Un icono SVG es opcional; los navegadores que lo admiten pueden usarlo a cualquier tamaño.
### ¿Por qué el archivo ICO contiene imágenes PNG?
El formato ICO puede almacenar imágenes PNG, y todos los navegadores actuales las leen. El archivo guarda versiones de 16, 32 y 48 px para que cada navegador elija el tamaño que necesita.
### ¿Qué es un icono maskable?
Un icono con espacio extra alrededor del logo, para que Android pueda recortarlo en un círculo u otra forma. La herramienta mantiene toda la imagen dentro de la zona segura, así que no se corta nada.
### ¿Por qué el icono táctil de Apple y el icono maskable llevan un color de fondo?
iOS muestra las zonas transparentes del icono táctil en negro, y un icono maskable tiene que rellenar toda su forma, así que ambos llevan el color que elijas. Los demás iconos mantienen la transparencia.
### ¿Se sube mi imagen?
No. Los iconos se dibujan en tu navegador, y la imagen nunca sale de tu dispositivo.
## Herramientas relacionadas en Análisis SEO
- [Comprobador de título y meta descripción](https://rankproof.eu/es/tools/seo-meta-title)
- [Comprobador de encabezados](https://rankproof.eu/es/tools/seo-heading-tags)
- [Comprobador de texto alt de imágenes](https://rankproof.eu/es/tools/seo-image-alt)
- [Comprobador de URL canónica](https://rankproof.eu/es/tools/seo-canonical-url)
- [Analizador de Robots.txt](https://rankproof.eu/es/tools/seo-robots-txt)
- [Generador de robots.txt](https://rankproof.eu/es/tools/seo-robots-txt-generator)