Generador de favicons
Suelta un logotipo, míralo en todos los tamaños reales y llévate favicon.ico, el juego PNG y el HTML.
PNG / JPEG / WebP / GIF / SVG, o suelta una en esta tarjeta
Hasta 2 caracteres; un carácter chino, japonés o coreano, o un emoji, se dibuja por sí solo.
Añade una imagen (o cambia a letras) y todos los tamaños aparecerán aquí: no hay botón «generar».favicon.ico 16/32/48 · PNG 16 · 32 · 48 · 180 · 192 · 512 · site.webmanifest · HTML
Cómo se usa
- Elige una imagen o arrastra una a la tarjeta: todos los tamaños aparecen a la vez. No hay botón de generar: lo que ves es lo que se descarga.
- ¿Aún no tienes logotipo? Cambia a «Letra / emoji» y escribe uno o dos caracteres. El selector de color fija el fondo y la letra se vuelve negra o blanca según el contraste.
- Descarga el paquete, descomprímelo en la raíz de tu sitio, pega las etiquetas <link> copiadas en el <head> y recarga tu sitio: el icono de la pestaña debería estar ahí.
Ejemplo
Origen
logo.png · 512×512, forma «Redondeado»
Paquete (9 archivos)
favicon.ico (16/32/48) favicon-16x16.png favicon-32x32.png favicon-48x48.png apple-touch-icon.png (180) android-chrome-192x192.png android-chrome-512x512.png site.webmanifest snippet.html
El mismo origen con las mismas opciones produce PNG idénticos byte a byte y un ZIP idéntico byte a byte (la marca de tiempo del archivo se fija en 1980-01-01), así que el paquete se puede versionar y comparar con diff. Cambiar la forma solo recorta las esquinas; nunca redibuja la ilustración.
Alcance, límites y preguntas frecuentes
- Sin exportación SVG. Un SVG que sobreviva a 16 px necesita trazados simplificados a mano; envolver el mapa de bits en SVG o dibujar texto con fuentes del sistema solo parecería arte vectorial. Conserva tu propio .svg junto a este juego PNG si lo quieres.
- Las imágenes se ajustan, nunca se recortan. Un logotipo no cuadrado conserva márgenes transparentes: recórtalo o compónlo antes (el redimensionador y el convertidor de imágenes de este sitio pueden ayudarte).
- Los iconos transparentes reciben un fondo de la plataforma: iOS pinta uno detrás de apple-touch-icon y algunos lanzadores de Android también. Para controlar el fondo, usa «Letra / emoji» o añade el fondo a la imagen de origen.
- site.webmanifest solo enumera iconos, sin name ni short_name. Ese es el nombre de tu sitio, que esta herramienta no puede conocer; añade ambas claves después de descomprimir (name es opcional y los navegadores recurren al título de la página).
- favicon.ico incluye 16, 32 y 48 px, no 64 ni 128. Eso cubre los navegadores modernos y Windows; añade más tamaños como PNG si los necesitas.
- GIF / WebP animados: solo se usa el primer fotograma. Los favicons no se animan de todos modos.
- Los iconos de letra se dibujan con la fuente de tu sistema, así que difieren entre macOS, Windows, Linux y móviles. El PNG congela lo que muestra tu dispositivo, y por eso tampoco hay selector de fuentes.
- Sin consulta de URL ni comprobación en vivo: esta herramienta no acepta una dirección de sitio web y no puede verificar un favicon ya publicado. Tras publicar, abre tu sitio y mira la pestaña.
- Límites: 20 MB por archivo y 8000 px por lado. Los orígenes de menos de 180 px se amplían para los iconos grandes y pueden verse borrosos.
- Sin recorte, sin eliminación de fondo, sin lotes y sin historial: al recargar se parte de un estado vacío (no se guarda nada ni se escribe nada en la URL).
Herramientas relacionadas
Lo que la gente suele necesitar después, una vez colocados los iconos.