Generador de favicons
Convierte una imagen en los tamaños de favicon que usa un sitio moderno: 16, 32, 48, 180, 192 y 512 px, con las etiquetas link correspondientes. Funciona en tu navegador; no se sube nada.
Suelta un logo y esta herramienta lo dibuja en los seis tamaños de icono que un sitio actual realmente referencia —16, 32 y 48 para la pestaña del navegador y el resultado de Google, 180 para el icono táctil de Apple, y 192 y 512 para el manifiesto de aplicación web— y te entrega además el marcado para <head> y las entradas del manifiesto. Todo se renderiza en un canvas dentro de tu propio navegador, así que la imagen nunca se sube, y puedes aplanar la transparencia sobre un fondo o añadir aire alrededor de la marca antes de exportar.
Para qué sirve un juego de favicons
Un favicon es la imagen pequeña que el navegador muestra en la pestaña, en los marcadores y en el historial; Google también muestra una junto a tu resultado en la búsqueda móvil. Un solo archivo ya no basta, porque la misma marca aparece hoy a 16 px en una pestaña y a 512 px en la pantalla de inicio de Android, y una única imagen escalada por el navegador se ve turbia en un extremo o desperdiciada en el otro. Esta herramienta renderiza cada tamaño por separado a partir de tu original, de modo que cada icono recibe su propia reducción limpia, y genera PNG en todos los casos: el formato que aceptan todos los navegadores actuales.
Cómo funciona el generador de favicons
Tu imagen se decodifica una sola vez y luego se dibuja por separado en un canvas para cada tamaño de destino: 16, 32, 48, 180, 192 y 512 píxeles. Cada icono es, por tanto, una reducción del original y no un remuestreo de una copia ya encogida, que es justo lo que evita que los tamaños pequeños queden pastosos. El dibujo conserva la proporción y centra el resultado, así que un logotipo apaisado se enmarca con franjas en lugar de aplastarse, y un margen opcional da aire a las marcas que llegan al borde. Cada canvas se codifica como PNG: sin pérdida, con canal alfa y legible por todos los navegadores actuales. La guía de Google pide un icono cuadrado múltiplo de 48, y por eso 48 y 192 están en el juego.
Características
Cómo generar tus iconos
Selecciona una imagen de origen: cuadrada y de al menos 512 × 512 da el resultado más nítido.
Decide si conservas la transparencia o la aplanas sobre blanco o negro.
Añade margen interior si tu marca llega al borde y necesita aire.
Ejecuta la herramienta, descarga cada tamaño y pega el marcado en tu <head>.
Errores frecuentes
Ejemplos
Ver también
- Redimensionador de imágenes — ¿Tu origen no es cuadrado? Redimensiónalo o recórtalo a un cuadrado antes de generar el juego.
- Conversor de formatos de imagen — ¿Partes de un logo JPEG? Pásalo antes a PNG para que los iconos conserven bordes limpios.
Preguntas frecuentes
¿Sigo necesitando un archivo favicon.ico?
Solo si todavía das soporte a Internet Explorer. Todos los navegadores publicados en la última década leen favicons PNG declarados con una etiqueta link, y por eso esta herramienta genera PNG. Mantener un favicon.ico en la raíz del sitio sigue siendo inofensivo si ya lo tienes, porque los navegadores piden esa ruta por defecto cuando no hay ninguna etiqueta link.
¿Por qué seis tamaños en lugar de uno?
Porque la misma marca se muestra a escalas muy distintas. 16 y 32 px van en la pestaña del navegador, 48 px es el tamaño que prefiere el indexador de Google para el icono junto a tu resultado móvil, 180 px es lo que usa iOS cuando alguien añade tu sitio a su pantalla de inicio, y 192 y 512 px son los tamaños a los que apunta un manifiesto de aplicación web. Renderizar cada uno desde el original los mantiene nítidos.
¿Se sube mi logo a un servidor?
No. Tu navegador lee la imagen, la dibuja en un canvas y la exporta en la propia página. Nada cruza la red, así que un logo aún no publicado se queda en tu equipo.
¿De qué tamaño debe ser mi imagen de origen?
Cuadrada y de al menos 512 × 512. Así el icono más grande es una copia directa y todos los demás son reducciones, que es la dirección que conserva el detalle. Si tu origen es más pequeño, la herramienta sigue funcionando pero te avisa de qué tamaños hubo que ampliar.