UlvixorCrear Favicon
Sube tu logo o ícono y genera automáticamente los archivos de favicon estándar para tu sitio web: un favicon.ico con versiones a 16, 32 y 48 píxeles, y un apple-touch-icon.png de 180×180 píxeles para dispositivos Apple. Todo se genera con canvas directamente en tu navegador. El archivo nunca se sube a ningún servidor.
Cómo funciona
- Selecciona tu logo o ícono desde tu equipo con el selector de archivos; idealmente una imagen cuadrada.
- Presiona 'Generar favicon' para iniciar el proceso.
- La herramienta genera un favicon.ico multi-resolución con versiones a 16, 32 y 48 píxeles, reutilizando la misma lógica del Conversor a ICO.
- En paralelo, genera un apple-touch-icon.png de 180×180 píxeles, el tamaño que esperan los dispositivos Apple para íconos de pantalla de inicio.
- Descarga cada archivo por separado y súbelos a la raíz de tu sitio, enlazándolos desde el <head> de tu HTML.
Casos de uso
- Generar el favicon.ico y el apple-touch-icon.png de un sitio web nuevo a partir del logo de la marca.
- Reemplazar el favicon genérico de un proyecto por uno propio sin usar software de diseño.
- Crear íconos consistentes para que tu sitio se vea igual en la pestaña del navegador y en la pantalla de inicio de un iPhone.
- Regenerar los archivos de favicon después de actualizar el logo de un sitio existente.
Casos de uso
- Generar el favicon.ico y el apple-touch-icon.png de un sitio web nuevo a partir del logo de la marca.
- Reemplazar el favicon genérico de un proyecto por uno propio sin usar software de diseño.
- Crear íconos consistentes para que tu sitio se vea igual en la pestaña del navegador y en la pantalla de inicio de un iPhone.
- Regenerar los archivos de favicon después de actualizar el logo de un sitio existente.
Errores comunes
- Subir una imagen rectangular, no cuadrada, y sorprenderse de que el favicon se ve estirado o deformado.La herramienta ajusta la imagen a las dimensiones cuadradas de cada ícono sin recortar, por lo que una imagen no cuadrada se deforma. Usa una imagen cuadrada como origen, o recórtala primero a un cuadrado con la herramienta de Recortar Imagen.
- Subir un logo con mucho detalle fino esperando que se siga viendo nítido a 16×16 píxeles.A tamaños tan pequeños como 16×16, los detalles finos y el texto se pierden o se ven borrosos. Para mejores resultados, usa un ícono simple, por ejemplo solo el símbolo de tu marca sin texto, como imagen de origen.
- Subir un GIF animado esperando que el favicon conserve la animación.Esta herramienta usa una única imagen estática como origen; si subes un GIF, solo se toma el primer fotograma, sin animación.
Preguntas frecuentes
No. Tanto el favicon.ico como el apple-touch-icon.png se generan completamente en tu navegador usando canvas. La imagen nunca se envía a ningún servidor.
Porque la herramienta ajusta tu imagen a dimensiones cuadradas (16×16, 32×32, 48×48 y 180×180) sin recortarla. Si el origen no es cuadrado, la imagen se estira para encajar y se ve deformada.
Un favicon.ico (con versiones a 16, 32 y 48 píxeles) y un apple-touch-icon.png (180×180 píxeles). Sube ambos archivos a la raíz de tu sitio web y enlázalos desde las etiquetas <link> correspondientes en el <head> de tu HTML.
Esta herramienta genera específicamente favicon.ico y apple-touch-icon.png, los dos archivos más usados para navegadores de escritorio y dispositivos Apple. No genera el conjunto completo de íconos que requieren algunas PWA para Android, por ejemplo distintos tamaños en manifest.json.
Alternativas
Generadores online como RealFaviconGenerator ofrecen opciones más avanzadas, por ejemplo íconos específicos para Android o Windows. Esta herramienta cubre el caso más común, favicon.ico y apple-touch-icon.png, de forma rápida y sin subir tu logo a ningún servidor externo.