Generador de Favicons
Sube una imagen y obtén un conjunto completo de favicons — seis tamaños PNG, cada uno previsualizado y descargable por separado — además del HTML exacto para pegar en el <head> de tu sitio. Nada de lo que subas sale nunca de tu navegador.
Tu conjunto de favicons
Pega esto en tu <head>
Guarda cada archivo descargado en la carpeta raíz de tu sitio con su nombre exacto, y luego añade estas etiquetas:
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="48x48" href="/favicon-48x48.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="192x192" href="/android-chrome-192x192.png">
<link rel="manifest" href="/site.webmanifest">
El archivo de 512×512 no se enlaza con una etiqueta <link> —
va dentro del array icons de tu archivo site.webmanifest, referenciado por la línea rel="manifest" de arriba, para los iconos de
instalación PWA y las pantallas de bienvenida.
Una imagen, un conjunto completo de favicons
Los sitios modernos necesitan más tamaños de favicon de los que
cubría el antiguo archivo .ico de 16×16: un icono
nítido para las pestañas del navegador, uno más grande para los
accesos directos de Windows, un icono táctil de Apple para la
pantalla de inicio de iOS, e iconos de Android/PWA para las
instalaciones de apps. Esta herramienta dibuja tu imagen subida
en un lienzo en cada uno de esos tamaños exactos y te deja
descargar cada resultado como su propio PNG — sin ida y vuelta
al servidor, y sin un formato binario heredado que arruinar.
Ejemplo práctico
Sube un logo cuadrado de 512×512. La
herramienta lo renderiza al instante en 16×16, 32×32, 48×48, 180×180, 192×192, y de vuelta a 512×512 — seis previsualizaciones etiquetadas,
cada una con su propio botón de descarga y el nombre de archivo
correcto ya puesto. Guarda los seis archivos junto a tu index.html, pega el fragmento de seis líneas en tu
<head>, y cada plataforma — pestañas del
navegador, pantalla de inicio de iOS, instalaciones Android/PWA
— usa automáticamente el tamaño correcto.
Preguntas frecuentes
¿Esto genera un archivo .ico?
No — genera archivos PNG individuales en cada tamaño estándar (de 16×16 a 512×512), no un contenedor .ico multirresolución heredado. Es una elección deliberada y honesta: todos los navegadores actuales aceptan favicons PNG directamente, así que un conjunto de PNG con el tamaño correcto es la práctica actual recomendada, no un atajo. Escribir un archivo .ico correcto byte a byte es un formato binario propio, y preferimos darte archivos que funcionen garantizado antes que simular un formato que no podemos verificar.
¿Los favicons PNG funcionan en todos los navegadores?
Sí, en cualquier navegador de los últimos años. El requisito de .ico es un resto de versiones muy antiguas de Internet Explorer; todos los navegadores modernos (Chrome, Firefox, Safari, Edge) leen iconos PNG referenciados con una simple etiqueta <link rel="icon"> sin problema — por eso sitios como GitHub o Google publican conjuntos PNG en vez de .ico hoy en día.
Mi imagen de origen no es cuadrada, ¿los iconos saldrán deformados?
Sí. Cada tamaño se genera dibujando tu imagen directamente sobre un lienzo cuadrado de ese tamaño exacto, así que una imagen no cuadrada se estira para encajar. Para el mejor resultado, recorta primero tu imagen a un cuadrado — nuestra herramienta Recortador de Imágenes lo hace en segundos — y luego pásala por este generador.
¿Mi imagen se sube a algún servidor?
No. El archivo nunca sale de tu dispositivo — se decodifica y se redibuja en cada tamaño usando el propio Canvas API del navegador, y cada descarga se genera localmente. Nada se envía, se guarda ni se registra en un servidor.