Generador de favicon

Sube una imagen una vez, descarga todos los tamaños de favicon que necesites: pestañas del navegador, pantalla de inicio de iOS e iconos de Android/PWA, más el HTML para usarlos.

Haz clic para elegir una imagen, o arrástrala hasta aquí

Las imágenes cuadradas funcionan mejor. Se queda en tu dispositivo, no se sube nada.

Qué obtienes

Un .zip con PNGs de 16×16, 32×32 y 48×48 para pestañas del navegador, un apple-touch-icon de 180×180 para pantallas de inicio de iOS, y PNGs de 192×192 / 512×512 para manifiestos de Android y PWA, además de un archivo de texto con las etiquetas <link> exactas para pegar en el <head> de tu sitio.

Cómo funciona

Tu imagen se recorta primero al mayor cuadrado centrado que cabe dentro de ella, y una sola llamada a drawImage() recorta ese cuadrado y lo escala a un canvas del tamaño buscado en un solo paso, así que las imágenes no cuadradas salen recortadas en vez de estiradas. Esto ocurre seis veces, una por cada tamaño: 16, 32, 48, 180, 192 y 512 píxeles, y cada canvas se exporta como PNG. El archivo .zip se ensambla byte a byte en JavaScript e incluye un archivo de texto con las etiquetas <link> exactas para pegar en tu <head>.

No hay archivo .ico: todos los navegadores actuales aceptan favicons en PNG. De los tamaños generados, 32×32 cubre las pestañas del navegador en pantallas modernas, 180×180 es lo que usa iOS para los accesos directos de la pantalla de inicio, y 192×192 más 512×512 son los dos tamaños que exige la especificación PWA. Un icono que se ve genial a 512px suele volverse ilegible a 16px, así que prioriza una forma sencilla y buen contraste sobre el detalle fino.

La imagen que subes se decodifica, recorta, redimensiona y comprime en la memoria de tu navegador; no existe ningún endpoint de subida en esta página. Vigila la pestaña Red mientras generas: la única transferencia es el .zip terminado, moviéndose de la memoria a tu carpeta de descargas.

Preguntas frecuentes

¿Por qué no un archivo .ico?

Los navegadores modernos, iOS y Android admiten favicons PNG directamente, que es lo que es cada tamaño de esta descarga. Un archivo .ico históricamente empaquetaba varios tamaños en un solo contenedor, pero ya no es necesario, el fragmento HTML incluido indica a los navegadores el PNG correcto para cada contexto.

¿Qué imagen debería subir?

Una imagen cuadrada funciona mejor y se recorta de forma limpia. Las imágenes no cuadradas se recortan automáticamente a un cuadrado centrado antes de redimensionarlas, así que la parte importante de tu logo debería estar cerca del centro.

¿Se sube mi imagen a algún sitio?

No, cada tamaño se genera localmente en tu navegador usando la API de canvas. Nada se envía a un servidor.