Cómo usar Generador de favicon
- 1
Elige un origen
Sube un logotipo o una imagen de hasta 25 MB, escribe de una a tres letras en una de las 11 fuentes disponibles o elige un emoji.
- 2
Diseña el icono
Elige una de las 12 opciones de forma, desde sin forma o un cuadrado liso hasta una galleta o un trébol, un color de fondo o transparencia, el margen interior y el radio de las esquinas.
- 3
Revisa cada tamaño
Mira el icono de 16 a 192 píxeles, en pestañas de navegador claras y oscuras, y dentro de la zona segura maskable de Android.
- 4
Descarga e instala
Guarda favicon.zip, descomprímelo en la carpeta de tu sitio y pega el HTML generado en el head de la página.
Límites y Pro
Conjuntos de iconos ilimitados a partir de texto o emoji; imágenes de hasta 25 MB, de una en una. Cada conjunto tiene 10 archivos.
Pro eleva el límite de subida de imágenes de logotipo a 4 GB. Ver Pro
Acerca de Generador de favicon
El generador de favicon crea, a partir de un solo diseño, el conjunto completo de iconos que necesita un sitio web moderno. El ZIP contiene favicon.ico con imágenes de 16, 32 y 48 píxeles, PNG independientes de 16, 32 y 48 píxeles, un apple-touch-icon de 180 píxeles con fondo opaco (iOS añade sus propias esquinas redondeadas), iconos de Android Chrome de 192 y 512 píxeles, un icono maskable de 512 píxeles cuyo contenido queda dentro de la zona segura del 80 %, un site.webmanifest con el nombre de tu aplicación, el nombre corto y el color del tema, y un fragmento HTML listo para pegar con las etiquetas link y theme-color. Todos los PNG se optimizan sin pérdida.
Las imágenes que subes se reducen con un filtro Lanczos, así que un logotipo grande se mantiene nítido incluso a 16 píxeles, y un logotipo SVG se dibuja primero a 1.024 píxeles. Los iconos de texto se generan con la fuente que elijas y los emojis con la fuente Noto Color Emoji, de modo que el resultado se ve igual en el sistema de cada visitante. Si tus iconos no van en la raíz del sitio, escribe la carpeta, por ejemplo /icons/, y las rutas del fragmento y del manifiesto se ajustan.
Sus usos habituales son un sitio web o blog nuevo, una aplicación web que se instala en la pantalla de inicio, un panel interno que debe destacar entre las pestañas del navegador o un icono provisional para un proyecto personal. Los detalles finos y las palabras largas desaparecen a 16 píxeles, por eso funcionan mejor las formas simples y una o dos letras. La herramienta no aloja los archivos ni modifica tu sitio: los subes tú mismo.
Privacidad
Los iconos se dibujan en canvas en esta pestaña y los codifica el códec PNG de WebAssembly del sitio en un Web Worker, así que el logotipo que subes nunca sale de tu dispositivo. Si eliges una de las fuentes de Google o el origen Emoji, el navegador descarga esa fuente de Google Fonts cuando empiezas a editar; la solicitud indica la fuente, nunca tu texto, y no se descarga nada al cargar la página.
Características
Conjunto completo de iconos
ICO, tamaños PNG, Apple touch icon, iconos de Android y maskable, y un manifiesto web en un solo ZIP.
Imagen, texto o emoji
Usa tu logotipo, de una a tres letras en 11 fuentes o cualquier emoji como origen.
Formas expresivas
Cuadrado, redondeado, círculo y ocho formas Material, con controles de margen interior y radio de las esquinas.
HTML listo para pegar
Las etiquetas link, el color del tema y las rutas del manifiesto se generan para la carpeta que elijas.