Cómo crear un favicon para tu sitio web
Todo sitio web necesita el pequeño icono de la pestaña del navegador, y los sitios modernos necesitan varios tamaños. Parte de un logotipo y obtén un ZIP con todo: los PNG que piden navegadores y teléfonos, un ICO clásico y un manifiesto del que partir.
Paso a paso
Abre el generador de favicons
Inicia el generador gratuito; acepta imágenes JPEG, PNG, WebP o AVIF de hasta 50 MB.
Añade tu logotipo o marca
Un origen simple y contundente de unos 1024 × 1024 funciona mejor; los orígenes rectangulares se contienen proporcionalmente, no se estiran.
Elige un fondo
Conserva la transparencia o coloca la ilustración sobre un color de fondo sólido; el espacio sin usar de cada cuadrado sigue tu elección.
Genera el paquete de iconos
Los tamaños de 48 px en adelante reciben un relleno interior de aproximadamente el 6 % para que la marca nunca toque el borde.
Descarga y despliega el ZIP
Obtienes 6 tamaños PNG (16, 32, 48, 180, 192 y 512 px), un favicon.ico de 32 px y un site.webmanifest inicial que referencia los iconos de 192 y 512 px.
Consejos para acertar a la primera
El escalado automático no puede hacer legible una ilustración intrincada a 16 px; simplifica la marca de origen e inspecciona los archivos más pequeños antes de publicarlos.
El ICO contiene una sola imagen de 32 px, que cubre el caso clásico de la pestaña del navegador; el manifiesto aún necesita revisar su nombre, rutas y ajustes de tema para tu sitio real.
El ZIP contiene recursos, no HTML: añade los elementos link apropiados y despliega los archivos en rutas que coincidan con la configuración de tu sitio.
Preguntas frecuentes
¿El origen del favicon debe ser ya cuadrado?
No. Un origen rectangular se contiene proporcionalmente dentro de cada salida cuadrada. El espacio sin usar queda transparente o usa el color de fondo seleccionado.
¿El ZIP incluye las etiquetas link HTML para mi sitio?
No. Contiene los recursos de iconos y un manifiesto inicial. Añade los elementos link apropiados y despliega los archivos en rutas que coincidan con la configuración de tu sitio.